Written by Kasumi

【簡単】Advanced Custom Fieldsを使い、手動で任意の関連記事を出力するフィールドを導入

wordpressで、Advanced Custom Fields(以下ACF)プラグインを使ってカスタムフィールドを導入している。

投稿ページ下部に任意の関連記事を複数出力したい。

Advanced Custom Fieldsの関連タイプを使いたい。

本記事ではこのような悩みを解決します。

関連フィールドを追加

まず最初にACF管理画面で関連記事用のフィールドを追加します。

任意のフィールドラベル・フィールド名(出力する時使います)を入力します。

A:フィールドタイプで関連を選択してください。

B:関連記事で出す投稿タイプを選択します。デフォルトは投稿を選択

C:任意のカテゴリーで関連記事を出したい場合は選択します。

D:投稿IDを選択します。

上記選択後、フィールドを出力したい位置(デフォルトは投稿タイプの投稿を選択)を決め、公開します。

関連記事を選ぶ

前章で位置指定したページに関連フィールドが生成されてます。

左側から関連記事で出したい記事タイトルをクリックすると右側に移動されます。

任意で関連記事にしたい記事タイトルを複数選び、ページを更新してください。

関連記事を出力

  <?php
  //get_fieldで関連記事の配列を取得、変数に代入
  $recommend = get_field('recommend');
  $args = array(
    'post_type' => 'post', //投稿タイプを指定
    'posts_per_page' => '-1', 
    'post__in' => $recommend,  //投稿IDを配列で指定
  );
  $the_query = new WP_Query($args);
  ?>
  <?php if ($the_query->have_posts()) : ?>
    <?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
      <!-- ループ内容 -->
      <a href="<?php the_permalink(); ?>" class="post">
        <img src="<?php the_post_thumbnail_url(); ?>" alt="">
        <p><?php the_title(); ?></p>
      </a>
    <?php endwhile; ?>
  <?php else : ?>
  <?php endif; ?>
  <?php wp_reset_query(); ?>

上記phpコードを関連記事を出力したいテンプレートファイルに記述します。

get_fieldを使って、前章で設定した関連記事を取得し$recommend変数に代入します。引数にはフィールド名を入れます。

wp_queryを使ってpost_type パラメータ・post__inパラメータを指定します。

post_typeには投稿タイプを入れます。(デフォルトの場合はpostでOK)

post__inには$recommend変数を代入します。

最後にwhile文内に記事情報を取得するwordpdressタグを記述すればOKです。

以上の流れで関連記事を挿入できます。

まとめ

関連記事を出す方法は様々ですが、特定の記事を手動で選択したい場合があるかと思います。

そんな時Advanced Custom Fieldsの関連タイプが役立ちます。

以上で解説を終わります。

目次

関連記事

HTMLCSS プログラミング

html・CSSでテキスト文章を縦書きにする方法

2021.12.22
132
プログラミング

Webテキストの日本語に含まれる役物を半角にする方法

2020.06.03
389
プログラミング

webサイトで過去ページのデザイン・内容を見る方法【Wayback Machineで簡単】

2020.07.16
98
PHP プログラミング

phpを使ってサイトのドメインを取得し、URLを出力する方法。

2021.06.14
1628