【WordPress】Advanced Custom Fieldsを使いこなそう！【出力編】

本記事は先に設定編をご覧になることを推奨します。
記事はこちらから↓

【WordPress】Advanced Custom Fieldsを使いこなそう！【設定編】

目次
1. 1.コードで使う部分
2. 2.同ページのカスタムフィールドを出力する場合
3. 2-1.条件などなくそのまま出力する
4. 2-2.条件分岐して出力する
5. 3.別のページからカスタムフィールドを出力する場合
6. 3-1.特定の投稿タイプから出力する
7. 3-2.特定のタクソノミーから出力する
8. 4.まとめ

コードで使う部分

設定編で設定したフィールドグループのうち、使用する項目は以下の部分のみです。

なんともわかりやすいですね。

この“フィールド名”を指定することによって、簡単に出力ができます。

同ページのカスタムフィールドを出力する場合

まず基本の使い方を述べますので、どのページで出力する場合もこちらの項目に目を通すことをオススメします。

入力されている値をそのまま出力する

以下の文をコピペしましょう。

echoなどを入れると、エラーが出てしまうので注意してください。

条件分岐して出力する

フィールド内に何かしらの値が入ってる時のみ出力する場合は、以下の文をコピペしましょう。

• get_field(‘フィールド名’)→値を取得する
• the_field(‘フィールド名’)→値を出力する

という認識で構いません。以上がどのページにおいても基本のコードとなります。

別のページからカスタムフィールドを出力する場合

他のページにあるフィールドの値を出力したいときは、上で示したコードの外側にループ文の条件を加えてあげましょう。

まず、どの条件からでも共通するループ文を表記します。今回はWP_Queryで記します。

query($args);
if( $query->have_posts() ): while( $query->have_posts() ): $query->the_post();
  //ループ内容
endwhile;endif;wp_reset_postdata();
?>

特定の投稿タイプから出力する

 '指定したい投稿タイプ',
  );
?>

指定できる投稿タイプは以下の通りです。

any	全ての投稿タイプ
post	標準の投稿
page	固定ページ
attachment	アップロードされたファイル
revision	下書きや公開済みの投稿・固定ページ
nav_menu_item	ナビゲーションメニュー
カスタム投稿タイプ名	任意のカスタム投稿タイプ名

‘post_type’の値は入力しなければ、’any’となります。

特定のタクソノミーから出力する

以下のような構成のタクソノミーを作成したとします。
(これ以降、[ ]内はフィールド名表記)

上画像の記事構造は、
カスタム投稿：東京都[tokyo]の内部に、
タクソノミー：新宿区[shinjukuku]、渋谷区[shibuyaku]が存在しています。

新宿区のカスタムフィールドを出力したい場合は、

 'tokyo',
    'taxonomy' => 'shinjukuku'
  );
?>

と追加すればOKです。

新宿区のタクソノミーを他で使っていないならば、

 'shinjukuku'
  );
?>

こちらの記述だけでも同様の動作をします。

また、新宿区のタクソノミー内に、

一番下の、“東西”[touzai]というようなラジオボタンを用意しました。

このフィールドで、“東口”[higashiguti]に選択されたもののタイトルだけを出力したいとします。

その場合、以下のようなコードになります。

 'tokyo',
    'taxonomy' => 'shinjukuku',
    'meta_key' => 'touzai',
    'meta_value' => 'higashiguti'
  );
if( $query->have_posts() ): while( $query->have_posts() ): $query->the_post();
  the_title();
endwhile;endif;wp_reset_postdata();
?>

‘meta_key’ や ‘meta_value’の使い方は理解していただけたでしょうか。

まとめ

いかがでしたでしょうか。

今回の記事は、筆者がはじめてCustom Posttype UIとAdvanced Custom Fieldsを使った複雑な構成のサイトを作るときに、だいぶ手間取った出力の仕方をわかりやすくお伝えできたらなと思い、この記事を書かせていただきました。

ぜひWordpressを使っている方は、当ブログの他のWordpress関連の記事にも目を通してみてください。