おはようございます！
6月19日、水曜日。快晴🌞
東京の最高気温31℃。昨日との気温差＋7℃。
暑いぞー！！ι(´Д｀υ)ｱﾂｨｰ
叫んでも仕方ないので、今日も学んでまいります。
今日の教材もこちら！
今日からCHAPTER５に突入です！
CHAPTER５ 投稿タイプ・フィールド・タクソノミーをカスタマイズする
SECTION０１ カスタム投稿タイプで投稿できる種類を増やす
ここからは「フード紹介」という新しいコンテンツページを作成
学習用素材の「food.html」と「single-food.html」を確認
＜food.html＞
＜single-food.html＞
管理画面から投稿したときに自動的に一覧ぺージを更新するため、「投稿」や「固定ページ」と同様、「フード」という新しい投稿型のページを作成する。
・デフォルト投稿タイプ
投稿タイプという属性
管理画面 → 「投稿」の記事 ［投稿タイプ【post】］ → データベース
管理画面 → 「固定ページ」の記事［投稿タイプ【page】］ → データベース
・主要なデフォルト投稿タイプ
ラベル
投稿タイプ名
投稿
固定ページ
添付ファイル
リビジョン
ナビゲーションメニュー
post
page
attachment
revision
nav_menu_item
・カスタム投稿タイプ
「フード」という新しい投稿型のページを作成する。
- カスタム投稿タイプ「food」を作成
- テンプレートファイルを作成
管理画面 → 「投稿」の記事 ［投稿タイプ【post】］ → データベース
管理画面 → 「固定ページ」の記事［投稿タイプ【page】］ → データベース
管理画面 → 「フード」の記事 ［投稿タイプ【food】］ → データベース
・Custom Post Type UIプラグインでカスタム投稿タイプを作成する
インストール→有効化
・Custom Post Type UIの設定
「CPT UI」→「投稿タイプの追加と編集」
・設定ボックスの主な項目
項目名
内容
一般公開
UIを表示
アーカイブあり
・・・
このカスタム投稿ページを表示するかどうか。
管理画面の左メニューにカスタム投稿タイプを表示するかどうか。
「archive-{post_type}.php」のテーマファイルを使用するかどうか。
・・・
・表示を確認する
・カスタム投稿タイプで投稿する
「フード」に投稿してみる。
・設定する内容
設定項目
内容
タイトル
本文
アイキャッチ画像
URL
タコス
「投稿用素材」フォルダー内の「テキスト.txt」を参照
「投稿用素材」フォルダー内の「pic.png」を使用
tacos
・テンプレートファイルを作成する
「フード」のテンプレートファイルを作成する。
・カスタム投稿タイプ表示のテンプレート階層
優先順位
テンプレートファイル名
１
２
３
archive-{post_type}.php
archive.php
index.php
メニューの投稿タイプは「food」なので、優先順位が一番高い「archive-food.php」という名前のテンプレートファイルを作成する。
→学習用素材の「food.html」を「archive-food.php」にリネーム
※ヘッダー部分とフッター部分の削除を忘れないこと。
＜archive-food.phpを編集＞
＜loop-food.phpを作成>
実装！
おっけーい！
詳細ページに画像と値段が欲しいところだが、それはこの後の章でやるのかな。。
よしよし！
次のセクションいってみよう！
SECTION０２ カスタムフィールドで記事の入力項目を増やす
学習用素材の「single-food.html」を確認
→「カスタムフィールド」機能を使用して各項目（「価格」「カロリー」「アレルギー」）ごとに入力できるようにする。
※「フード写真」「オススメ」も設定する。
・Advanced Custom Fieldsプラグインでカスタムフィールドを作成する
＜カスタムフィールドボックス＞
→入力するたびに選択する必要があり、決して使いやすいとはいえない。
インストール→有効化
・フィールドグループを作成する
・価格 ･･･カスタムフィールド
・カロリー ･･･カスタムフィールド
・アレルギー ･･･カスタムフィールド
・… ･･･カスタムフィールド
「フード」のタコスを確認すると、
フード詳細の設定欄ができた！
各項目を入力していく。
「フード」の個別投稿ページのテンプレートファイルを作成し、カスタムフィールドを表示する。
・個別投稿表示のテンプレート階層
優先順位
テンプレートファイル名
１
２
３
４
single-{post_type}.php
single.php
singular.php
index.php
・カスタムフィールドの値を表示する
＜WordPress関数＞
ただ、少しコードが長いので、Advanced Custom Fieldsが有効化されていれば以下の関数が使える。
＜Advanced Custom Fields関数＞
また、表示せずに値だけを取得したい場合は、
＜Advanced Custom Fields関数＞
・テンプレートファイルを修正する
single-food.phpを修正
※忘れずにヘッダー部分とフッター部分を削除
なかなかの修正量でした。。。
・ブラウザで確認する
アップロードして実装！
….
まあ、一回で上手くいくとは思ってなかったよ、、、量が量なんでね。。。
・・・
おっけ。「)」が足りませんでした。
その他もろもろ微修正した結果、
一覧（loop-food.php）で価格が直書きだったので修正しました。
Facebookのリンクが一つだけ大きいのはよくわからんのでそのまま。
今日は２セクション分やったのでそこそこのボリュームになってしまった。
暑いので以上です。
お疲れ様でした！
コメント