【Custom Field Suite】関連ポストを表示させる方法

  • Custom Field Suiteの「関連ポスト選択」を使用して、関連ポストを表示したいな…

このような疑問にお答えします!

【Custom Field Suite】関連ポストを表示させる方法

「関連ポスト選択」を使用して、関連ポストを表示させるためのPHPコードは下記のとおり。

<ul>
  <?php $values = CFS()->get('フィールドの名前'); ?>

  <!-- 関連ポストを選択している場合 -->
  <?php if(is_array($values)): ?>

    <!-- 繰り返し -->
    <?php foreach($values as $post_id): ?>
      <li>
        <a href="<?php echo esc_url(get_permalink($post_id)); ?>">
          <div>
            <?php $thumbnail = get_the_post_thumbnail_url($post_id); ?>
            <?php if($thumbnail): ?>
              <img src="<?php echo $thumbnail; ?>" alt="">
              <?php the_post_thumbnail(); ?>
            <?php else: ?>
              <img src="<?php echo esc_url(get_theme_file_uri('img/img_dummy01.png')); ?>" alt="">
            <?php endif; ?>
          </div>
          <h3><?php echo get_the_title($post_id); ?></h3>
        </a>
      </li>
    <?php endforeach; ?>
    <!-- / 繰り返し -->

  <!-- / 関連ポストを選択している場合 -->
  <?php else: ?>
    <!-- 関連ポストを選択していない場合 -->
    <li>-</li>
    <!-- / 関連ポストを選択していない場合 -->
  <?php endif; ?>
</ul>

 

重要な箇所をピックアップしつつ、少しだけ解説しますね!

 

<?php $values = CFS()->get('フィールドの名前'); ?>

投稿IDの配列を取得します。

 

<?php if(is_array($values)): ?>
<?php else: ?>
<?php endif; ?>

配列が空かどうかによって条件分岐をさせてあげます。

 

<a href="<?php echo esc_url(get_permalink($post_id)); ?>"></a>

<div>
  <?php $thumbnail = get_the_post_thumbnail_url($post_id); ?>
  <?php if($thumbnail): ?>
    <img src="<?php echo $thumbnail; ?>" alt="">
    <?php the_post_thumbnail(); ?>
  <?php else: ?>
    <img src="<?php echo esc_url(get_theme_file_uri('img/img_dummy01.png')); ?>" alt="">
  <?php endif; ?>
</div>

<h3><?php echo get_the_title($post_id); ?></h3>

「foreach」で回した「$post_id」は、投稿IDが格納されている為、投稿IDを使って画像やタイトルを出力しております。

SNSでもご購読できます。

コメントを残す

前の記事

次の記事