カテゴリー
WordPress サイト構築

おすすめ記事をサムネイル表示するようにしました

こちらで紹介されている方法に少し手を加えました。
ありがとうございます!

変えたのは、.related-postのwidthを500pxではなく100%にして、自動で折り返されるようにしたのと、PHPのソースでアイキャッチがない場合の画像を出すようにしたぐらいです。

<?php if(have_posts()):?>
     <h1>こちらの記事もオススメです</h1>
     <div class="related-post">
     <?php while(have_posts()) : the_post(); ?>
          <?php if(has_post_thumbnail()):?>
               <div class="related-entry"><a href="<?php the_permalink() ?>"rel="bookmark"title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail("thumbnail"); ?><?php the_title(); ?></a></div>
          <?php else: ?>
               <div class="related-entry"><a href="<?php the_permalink() ?>"rel="bookmark"title="<?php the_title_attribute(); ?>"><img src="https://a-tak.com/blog/wp-content/uploads/2012/06/no-image.png" alt="NO IMAGE" title="no-image"><?php the_title(); ?></a></div>
          <?php endif; ?>
     <?php endwhile; ?>
     </div>
<?php else: ?>
<!-- 関連記事がないときのHTMLをここに書く-->
<div class="related-post">関連しそうな記事がありません。タグとかカテゴリーをたどったり検索してみてください。</div>
<?php endif; ?>

真ん中あたりで<?php else: ?>でNO IMAGEの画像を出すようにしています。
画像のリンクはソース埋め込み(笑)
関連記事がない場合の動作が思うように動いてないけど、まぁ、よしとしてます。

結構、目に留まるようになったので他の記事も読んでもらいやすくなるのではないかと思いました。

この記事を書いた人: A-tak

A-tak.com(えいたっく どっとこむ)の管理人。
Apple野郎なおっさんでしたが、ちょっと最近のAppleには飽き気味。
A-tak.comは2002年2月から運営(前身のサイトは1999年3月から)。今年で18年目!

Youtube / Twitter / Mastodon / Facebook