色々と情報を書いてくれている記事はたくさんあるけれど、やっぱりちゃんと考えて、最低限を理解して、自分のサイトに適用させていくのが大事だなーって改めて思いました。
今回は、導入したプラグインの実装と出力するための下準備(調査)までの内容です。
前回からの宿題
前回インストールしたプラグインを使って、ワードプレス側の投稿フォームを用意しました。
①Custom Post Type UIでカスタム投稿を実装
②Advanced Custom Fieldsでカスタムフィールドの用意
それぞれの設定は、前回記事内に記載した参考サイトで簡単にできました。
…そう、それぞれの設定は、迷うことなくできました。
▼Custom Post Type UIでカスタム投稿 旅ログを追加
▼カスタムフィールドも登録＋公開
カスタム投稿とカスタムフィールド、どこで関連付けるの？
ここでつまづきました。
シンプルに私が参考サイトをしっかりとは読み込んではいなかったことが原因。。。
カスタム投稿とカスタムフィールドの関連付け(紐づけ)は、Advanced Custom Fieldsにて設定が可能でした。
どこかというと、ココ。
▼位置という場所
デフォルトだと【投稿タイプ】【等しい】【post】。そのまま公開すると通常の投稿ページに追加されます。
今回はあくまでも、新しく追加したカスタム投稿にだけ、カスタムフィールドを表示したい。そのため、位置を【投稿タイプ】【等しい】【追加したカスタム投稿のpost_type(今回の場合はtrip_log)】に変更します。
これでOK！
ついでにカスタム投稿には、タイトル＋追加したカスタムフィールドだけを出したい。
▼ここにチェックを付けることでコンテンツエディタ(本文を入れる場所)を非表示に設定
以上の手順で、無事に新しい『カスタム投稿(旅ログ)』を追加し、その投稿画面には『カスタムフィールド(該当コンテンツに必要な項目のみ表示)』されている状態を用意することができました！
ちなみにpost typeはココで設定した文字列です。
▼Custom Post Type UIで設定している箇所
登録するための準備が完了したので、１記事分だけ下書きを作成。この内容で表示準備を進めていきます。
カスタムフィールドの内容をページに出力するには
さぁ、本当の闘いはここからだ。
この点は本当に苦戦しました。。。そして一人では解決しきれずに、ちょっとお力添えいただいています。
先に、私が感じた一番大事なことを書いてしまいます。
WEBにはいろんな参考サイトがありますが、それらの情報を見る中でPHPに関する知識がなく、手探りで実装を試みようとしている場合、そのサイトで【実装しているテーマは何か】ということを確認してください。
そして、極力自身が使用しているテーマと同じもの、またはPHP内の記述が近しいものを探してください。
私が使用しているテーマは【Emanon Free】です。(リニューアル時の記事もよければ)
残念ながら私が参考にしたサイトたちは別のテーマを使用しているものしか見当たらなかったので、がっつり手探りで対応することとなりました。
まず、クリアしなければいけない点を整理。
-
- ①カスタム投稿で投稿した記事に対応させる
-
- ②カスタムフィールドで入力した内容を出力する
大きくこの2点が必須事項となります。
前回調べた内容の振り返り
カスタム投稿タイプのテンプレートを用意
→投稿ページ（固定ページ）：single-{post_type}.php
→アーカイブページ（一覧ページ）：archive-{post_type}.php
取り急ぎ、アーカイブページは後回しにして、投稿ページの準備からスタートすることにしました。
①カスタム投稿で投稿した記事に対応させる
というわけで、レッツトライ。
まずは調べて分かっていること。
通常投稿ページの single.php を複製して、カスタム投稿のpost typeをルールにのっとって追記した single-{post_type}.php を用意する。すると post typeで判断して、通常の投稿ページと分けることができるとのこと。
それだけで良いのかと思い、さっそく用意。まずは準備してphpをUPしました。
これで①カスタム投稿で投稿した記事に対応させる はクリア。
実際には、読み分けされているのかどうかを判断するために、php内にコメントを記載して、投稿ページのプレビューを確認しつつ、ページ内ソースで single-{post_type}.php が選択されているのかどうかを確認しました。
②カスタムフィールドで入力した内容を出力する
さらなる問題はこっち。
調べると「こういう記述をすると表示されますよー」という記事はみつかるものの、それをどこに記述すればよいのかがさっぱりわからない。
というわけで、まずは該当するページの single-{post_type}.php に直接記述してみました。
あっているかどうかもわからないコードを、フィールド名だけ自分で用意した内容に変えて直書き！
まぁ、お分かりかと思いますが、ダメでした。
色々調べたところ、以下2つの情報を得ることができました。
Advanced Custom Fieldsプラグインで作成したカスタムフィールドを画面に表示するにはthe_fieldという命令を使って次のように記述する方法があります。
ふーむ。。。なるほどわからん。。。
結局どこに描かないといけないの？？
ソースコード内の「the_content(); ?>」を探して下さい。 この部分で記事を出力しています。
引用元: ワードプレス カスタムフィールド カスタム投稿 表示されない 対処法
ふーーーーむ。。。。。。
最初から不思議に思っていたんだけど、 single.php 内の記述、シンプル過ぎない？
この時点で、テーマによってphpの構成もがっつり異なることがあるということを初めて自覚したのでした。
今回はここまで。
Emanon Freeにカスタムフィールドを出力するための対応方法は次回に！
（半端ですみませんー！！）