Advanced Custom Fields で関連記事(任意記事)を出力する
WordPressで関連記事を実装するには、Yet Another Related Posts Plugin のように
投稿に対して自動で出力させる方法もありますが、
今回は、Advanced Custom Fields の「関連」フィールドを使い、
関連記事(任意記事)の出力をしてみます。
今回はオプションページを作成し、そこでの登録によりサイドバーなどの共通要素に対して出力するので、
あらかじめ、オプションページを作成しておく必要があります。
<br /> // ACF PRO オプションページ<br /> if( function_exists('acf_add_options_page') ) {<br /> $option_page = acf_add_options_page(array(<br /> 'page_title' => 'オプションページ testテスト',<br /> 'menu_title' => 'オプションページ<br>テスト',<br /> 'menu_slug' => 'opation_page_',<br /> 'capability' => 'edit_posts',<br /> 'redirect' => false<br /> ));<br /> }<br />
カスタムフィールドの作成
記事の登録のためのカスタムフィールドを作成します。
「新規追加」からフィールドタイプ「関連」を選択後、
各設定のオプションは任意ですが、登録の際の絞り込みに関してや、最大/最小登録数が設定可能です。
今回は下記のような設定になりました。
記事の選択
オプションページで表示させたい記事を選択します。
記事リストの出力
出力に関しては、foreachでのループでも可能ですが、
汎用的に使える WP_Query で出力します。
<br /> <?php $related_posts = get_field('related_posts','option'); // 関連記事IDの取得 $args = array( 'post_type' => 'post',<br /> 'posts_per_page' => -1,<br /> 'post__in' => $related_posts, //queryに含む投稿IDを指定<br /> 'orderby' => 'post__in' //表示順(配列に入っている順)<br /> );<br /> ?><br /> <?php $query = new WP_Query( $args ); ?><br /> <?php if($query -> have_posts()): ?></p> <h2>関連記事の出力(オプションページ)</h2> <ul> <?php while($query -> have_posts()): $query->the_post();?></p> <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> <p> <?php endwhile; ?> </ul> <p><?php endif; ?><br /> <?php wp_reset_postdata(); ?><br />
出力の結果
以上の手順でブラウザでは下記のように表示がされます。
管理画面から選択した投稿をドラッグ&ドロップすることで順番の変更が可能になりますが、
‘orderby’ => ‘post__in’ を指定しているので、その手順で変更した通りの順序で表示されます。
以上が Advanced Custom Fields の「関連」フィールドの使い方です。
今回のようにオプションページで設定するような各ページ共通の要素の出力のほか、
各記事に対してそれぞれ任意の記事を関連記事として表示させる、といったことも可能です。
Advanced Custom Fieldsを使用して制作したサイト
株式会社キュレーションジャパン様 PREMIUM JAPAN(プレミアムジャパン)
「日本のプレミアムを世界へ、日本へ。そして未来へ。」
Webサイトのキャッチコピー通り、日本の技術や文化、食などのプレミアムな情報を発信するメディアサイトです。
制作に携わらさせていただきましたが、面白く、参考になる情報など満載で、
私...
主婦と生活社様 暮らしとおしゃれの編集室
主婦と生活社様の「ナチュリラ」「大人になったら着たい服」「暮らしのおへそ」のWebサイトになります。
「ナチュリラ」「大人になったら着たい服」「暮らしのおへそ」の雑誌と同様にデザインはシンプルにしております。
ぜひ、ご覧ください!!