y.o.designers-works

WordPressの投稿一覧で最新の投稿だけアイキャッチを表示する

WordPressの投稿一覧で最新の投稿だけアイキャッチを表示させたり、他の投稿とは違うデザイン、表示方法にしたい場合はループの回数を取得して、条件分岐を記述すれば実現できます。

ループの記述方法

今回はカテゴリーID2に属している投稿一覧の、1つ目の投稿だけにアイキャッチ画像を表示するというサンプルを作ってみます。

<ul>
<?php
$args = array( 'posts_per_page' => '10', 'category' => 2, 'order' => "DESC" );
$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); $loopcount++; ?>
  <?php if ($loopcount <= 1): ?>
  <li>
    <?php the_post_thumbnail(); ?>
  </li>  
  <li>
   <a href="<?php echo get_the_permalink(); ?>">
     <?php the_title(); ?>
    </a>
  </li>
  <?php else: ?>
  <li>
  	<a href="<?php echo get_the_permalink(); ?>">
	 <?php the_title(); ?>
    </a>
  </li>
<?php endif; ?>
<?php endforeach; 
wp_reset_postdata(); ?>
</ul>

コード2行目の説明ですが、テンプレートタグ「get_posts」を使います。パラメータを配列に格納します。
上記の記述ですと「posts_per_page」に表示する投稿の数「10」を指定し、「category」にはカテゴリIDの「2」を指定し、「order」に「DESC(降順)」で表示させるという値をパラメータに設定してあげます。

4行目では繰り返し処理「foreach」を使い、ループ処理を設定します。
変数の名前は任意ですが、foreachの中で「$loopcount++;」という変数を設定します。
「++」は加算子(インクリメント)です。
1回ループする毎に「$loopcount」の値に+1されていきます。

5行目の「$loopcount <= 1」という記述ですが、「<=」は比較演算子で、「$loopcount」が1より少ないか等しいという意味になります。
この場合は、最初(1つ目)の投稿より小さいか、等しいかという条件分岐になります。

まとめ

ループの回数を分岐の条件式に使うことで、最初の記事だけでなく指定した記事の表示方法を変更することもできます。
今回は比較演算子の「<=」で小さいか、等しいかで比較しましたが、例えば「$loopcount == 3」ですと3つめの記事という指定もできます。
任意で何番目の投稿の表示方法を変更したい!というときに使える方法です。

スポンサーリンク

他にオススメな記事