カスタムフィールドの使用例

Wordpressにあるカスタムフィールドという機能をどのように使えばいいのかを解説します。

まずは3つの記事を投稿してみる

東京

大阪

札幌

タイトルが都市の名前、本文が写真という構成の記事を3つ作成しました。

リンクの最後尾は、後でphpファイルを編集する時に用いるため、英語にしておきます。

編集画面でカスタムフィールドを追加する

カスタムフィールドを出現させる

投稿編集画面の右上にあるボタンをクリック

出てきたメニューの一番下にある「オプション」をクリック

以下にチェックを入れる

編集スペースの下の方にカスタムフィールドを追加するフォームが出てくる

カスタムフィールドの名前を新規追加する

この記事では、以下の3つを追加します。

後で、phpファイルを編集するため英語で入力しましょう。

ここまで来たら、一度更新ボタンを押しておきましょう。

それぞれの記事ごとに値を設定する

プルダウンで名前を選択して、値を入力していきます。

東京

札幌

大阪

テーマのphpファイルを編集する

サーバーからファイルをダウンロードして編集する

ダウンロード

wp-content > themes > 使っているテーマの名前
ここから投稿ページのファイルを探します。
「single.php」のような名前のファイルがおそらく編集すべきファイルとなるでしょう。
そのファイルをダウンロードします。
子テーマを使っている場合は、親テーマからダウンロードして下さい。

編集

記事で検証ツールを使って、クラス名を調べましょう。
(ここでは、Google Chromeの検証ツールを使っています。)

今回は、mainboxが本文のスペースだということが分かりました。

エディタ上でmainboxを検索します。

見つかりました。

カスタムフィールドは、本文の最後に追加したいため、mainboxの最後にPHPのコードを記述します。

 <?php
　// 記事のURLを変数に代入
   $url = $_SERVER['REQUEST_URI'];

　// カスタムフィールドの値を変数に代入 → post_custom('カスタムフィールドに入力した名前'); で、カスタムフィールドに入力した値が取得できる
   $population = post_custom('population');
   $location = post_custom('location');
   $NearestStation = post_custom('NearestStation');

　// 記事のURLに「tokyo」か「osaka」、または「sapporo」が含まれていれば、  → strstr(文字列, '〇〇')で、文字列に〇〇が含まれているかどうかを判定する
   if(strstr($url,'tokyo') || strstr($url,'osaka') || strstr($url,'sapporo')):

　// 以下を表示する　→ ${変数名} とすると、文字列の中でも変数を利用できる(変数展開)
     echo "<p>人口：　${population}</p>";　
     echo "<p>撮影場所 ： ${location}</p>"; 
     echo "<p>最寄駅： ${NearestStation} </p>";
   endif;
　?>

</div><!-- .mainboxここまで -->

編集したファイルをサーバーにアップロードすれば、反映されます。

カスタムフィールド反映後の記事

東京

札幌

大阪

このように、カスタムフィールドは、複数の記事で同じフォーマットを使いたい時に利用できます。