表示している記事と同じカテゴリーの投稿をサムネイル(アイキャッチ)付きで表示する方法です。
php
phpのコードは以下の通りです。
同じカテゴリーの投稿があった場合、表示している投稿を除いた中から、新しい順に5件表示しています。
同じカテゴリーの投稿がない場合は、タイトルなどのhtmlタグは非表示になります。
<?php $categories = get_the_category(); foreach($categories as $category): $related_posts = get_posts(array('category__in' => array($category->cat_ID), 'exclude' => $post->ID, 'numberposts' => 5)); if($related_posts): ?> <h2>関連記事</h2> <ul> <?php foreach($related_posts as $related_post): $thumbnail = get_post_thumbnail_id( $related_post->ID ); $src_info = wp_get_attachment_image_src($thumbnail, 'full'); $src = $src_info[0]; $width = $src_info[1]; $height = $src_info[2]; $title = $related_post->post_title; ?> <li><a href="<?php echo get_permalink($related_post->ID); ?>"> <?php if ( has_post_thumbnail($related_post->ID) ) { echo '<img src="'.$src.'" alt="'.$title.'" width="'.$width.'" height="'.$height.'" />'; } ?><?php echo $title ?></a> </li> <?php endforeach; ?> </ul> <?php endif; endforeach; ?>
html
上記のphpコードで出力されるhtmlです。
4,5番目の投稿はサムネイルが登録されていない投稿です。
<ul> <li><a href="http://xxxx/1"> <img src="http://xxxx/image01.jpg" alt="タイトル1" width="200" height="100" />タイトル1</a> </li> <li><a href="http://xxxx/2"> <img src="http://xxxx/image02.jpg" alt="タイトル2" width="200" height="100" />タイトル2</a> </li> <li><a href="http://xxxx/3"> <img src="http://xxxx/image03.jpg" alt="タイトル3" width="200" height="100" />タイトル3</a> </li> <li><a href="http://xxxx/4"> タイトル4</a> </li> <li><a href="http://xxxx/5"> タイトル5</a> </li> </ul>