ちょうどクライアントワークで関連記事を表示させたいという要件があり、色々と調べていく中でAdvanced Custom Fieldsプラグインを使うのが便利というのを知りました。今後も使うケースが出てきそうということで、備忘録に残しておきたいと思います。  

関連タイプのカスタムフィールドを作成

まずは「Advanced Custom Fields」プラグインをインストールして有効化しておきます。Advanced Custom Fieldsプラグインの基本的な使い方については過去記事「プラグイン【Advanced Custom Fields】でカスタムフィールドを出力するときによく使うメモ」でも紹介していますので参考に。   有効化したら新規のフィールドグループを作成していきます。適宜仕様に合わせて進めていきますが、この時にフィールドタイプで「関連」カテゴリの「関連」の項目を選択します。   このような感じでその他も必要な項目を設定していきます。   設定を進めていくと「返り値のフォーマット」という項目が出てきます。この選択肢で「投稿オブジェクト」を選択するようにします。こうすることで、カスタムフィールドを出力する時に値を取得するのですが、投稿記事のいろんな情報がまとまった配列の形で受け取ることができます。   設定が完了し、フィールドグループを登録してから、フィールドグループが有効である投稿画面に行くと、先ほど登録したカスタムフィールドの入力枠が表示されています。ここでは関連記事の候補になる投稿記事がリストで表示されています。その中から関連記事として表示させたいものを直接選択していく形になります。   選択方法も簡単で、直接記事名をクリックすると当該項目が右側に表示され、左側のものは薄く表示される形に変わります。これで関連記事の対象に設定することができました。もちろん複数の記事を関連記事に設定することも可能です。   また、登録した関連記事は項目をドラッグすることで表示順を変更することができますし、クリックした時に表示される「-」のアイコンをクリックすることで選択を解除することができます。これで記事を更新し、あとはテンプレートファイル上に関連記事を出力するコードを追記するだけです。    

関連記事を出力するコードをテンプレートファイルに追記

関連記事の投稿情報は下記のコードで取得できます。またデバッグ用にprint_r関数などで配列の中身も見てみましょう。

<?php $post_object = get_field( 'FIELDS_NAME' ); ?>

// print_rなどで配列の中身を確認
<pre>
 <?php print_r($post_object); ?>
</pre>

  取得した関連記事の投稿情報はこのような中身になっているのが確認できます。

Array (
 [0] => WP_Post Object (
  [ID] => 1
  [post_author] => 1
  [post_date] => 2018-11-12 02:41:36
  [post_date_gmt] => 2018-11-12 02:41:36
  [post_content] => Welcome to WordPress. This is your first post. Edit or delete it, then start writing!
  [post_title] => Hello world!
  [post_excerpt] => 
  [post_status] => publish
  [comment_status] => open
  [ping_status] => open
  [post_password] => 
  [post_name] => hello-world
  [to_ping] => 
  [pinged] => 
  [post_modified] => 2018-11-12 02:41:36
  [post_modified_gmt] => 2018-11-12 02:41:36
  [post_content_filtered] => 
  [post_parent] => 0
  [guid] => http://localdev.local/?p=1
  [menu_order] => 0
  [post_type] => post
  [post_mime_type] => 
  [comment_count] => 1
  [filter] => raw
 ),
 [1] => WP_Post Object (
......
〜 以下、投稿情報が続く 〜

  このように配列で各投稿記事の情報が項目ごとに含まれていますので、あとはこれらをループで出力していく形になります。下記のようなコードでサイトに合わせて関連記事を出力するコードをテンプレート内に追記していきます。 【single.php】※一部抜粋

<?php
 $post_object = get_field( 'FIELDS_NAME' );
 if( $posts ):
?>
<h1>関連記事はこちら</h1>
<ul>
 <?php foreach( $post_object as $val ): ?>
 <li>
  <h2><?php echo get_the_title( $val->ID ); ?></h2>
  <a href="<?php echo get_permalink( $val->ID ); ?>">この記事を見る</a>
 </li>
 <?php endforeach; ?>
</ul>
<?php endif; ?>

  実際にページを見てみると、このように投稿へ設定した関連記事が出力されているのが確認できました。   ちなみに上記コードのループ内で、カスタムフィールドを使うケースの場合、下記のように、the_field関数の第二引数に配列の値を指定する形になります。

<?php echo the_field( 'FIELDS_NAME', $val->ID); ?>

 

---

  いかがでしょうか、関連記事を表示させるというのは比較的クライアントワークでもよく見かける要件なのではないでしょうか。ACFを使うことで簡単手軽に、かつ記事ごとに手動で自由に設定できるのが便利ですね。リテラシーがそこまで高くないユーザーにも直感的でわかりやすいかと思います。是非試してみてはいかがでしょうか。