ワードプレスの投稿画面をカスタムしたいならプラグインの「Advanced Custom Fields」が簡単で便利だぞ
ワードプレスでの投稿画面には通常の投稿ページと固定ページの投稿の2通りがありますが、「沖縄宝島+ライフログ」のようなサイトでは、通常のタイトルと本文だけの投稿画面では使いにくい。
[blogcard url=”https://xn--pbt44a265a73q.net/”]
一応、タグを使えば出来無い事は無いのですが、毎回タグを使うのはめんどくさい。という事で、今回はワードプレスのプラグイン「Advanced Custom Fields」を使って投稿画面をカスタムしようじゃないかという事です。
[blogcard url=”https://wordpress.org/plugins/advanced-custom-fields/”]
プラグインインストール方法
- WordPress管理画面 ＞ プラグイン ＞ 新規追加 ＞「Advanced Custom Fields」で検索
- 「Advanced Custom Fields」ダウンロードページよりダウンロード
プラグインはインストールしたら必ず「有効化」して下さい。
カスタムフィールドの作成
投稿画面に追加したい項目は以下の3つ
2 > 商品の価格
3 > 商品の購入場所等
4 > 商品の詳しい説明
1 はタイトルなので追加の必要なし。画像はアイキャッチなのでこれも設定の必要なし。
「Advanced Custom Fields」をインストールすることで「カスタムフィールド」がメニューに追加されていますので「新規追加」をクリックしてください。
上から順に、
フィールドラベル > 表示される名前
フィールド名 > ワードプレスに使うシステム名
フィールドタイプ > 入力するタイプ（この場合商品の値段を入力したいので数値になっているが、画像やテキスト等がある）
必要か？ > 入力を必須にするかどうかの選択
上記の入力完了したら下にスクロールし
「フィールドを閉じる」をクリックして下さい。
同様に、「場所」「説明」のフィールドを作成したら右側にある「更新」のボタンをクリックして完了です。
表示の確認
それでは投稿ページの確認をして見ましょう。
投稿画面にカスタムフィールドで作成した「値段」「場所」「説明」の項目が追加されています。
ただ、これだけじゃまだ表示されません。
テンプレートの編集
作ったカスタムフィールドは、そのままではページに表示されないのでテンプレートにコードを挿入する必要があります。
<?php echo post_custom('item_valuu'); ?>
上記のコードを表示させた居場所に埋め込めば表示されます。
赤枠部分をそれぞれのフィールド名に変更すればオッケーです。
まとめ
今回はプラグインを使用したとはいえ、テーマのテンプレートにコードを挿入しないといけないと言う点で初心者向けとは言えない内容になってしまいましたが、便利で簡単なので、できれば挑戦してみてください。
それと、「沖縄宝島+ライフログ」というサイトの性質上、全ての投稿に同じような項目を入力するので投稿ページに追加しましたが、固定ページのように全く別ページやカテゴリを作ることも可能です。が、その場合はまた別のプラグインなどが必要になってきたりしますので別の機会があれば紹介したいと思います。
では。
