カテゴリの人気記事を表示する方法

記事を読んで頂いていて該当記事を読み終わった後に、同じカテゴリーに属する人気記事を表示する方法です。

せっかく訪問して頂いて記事を読んでもらった後に同じカテゴリー内で人気のある記事が表示されていたら、読んで頂ける可能性が高くなると思われます。

車に関する記事を読んでいてその下に、
同じカテゴリーの車、メンテナンスに含まれる人気記事が表示されるということです。

スポンサーリンク

具体的な方法としては、

<!--カテゴリの人気記事を入れた場所ここから-->

<h4 class="under_single_h4">「<?php the_category(', ') ?>」の人気記事</h4>
 <div id="cateninki">
 <?php if ( function_exists('wp_is_mobile') && wp_is_mobile() ) :?>
 <?php
 wp_reset_query();
 $cat = get_the_category();
 $cat_id = $cat[0]->cat_ID;
 $cat_name = $cat[0]->cat_name;
 ?>
 <?php
 $wpp = array (
 'cat' => ''.$cat_id.'',
 'limit' => '5', 
 'range' => 'all',
 'order_by' => 'views',
 'post_type' => 'post',
 'stats_comments' => '0', 
 'stats_views' => '0', 
 'thumbnail_width' => '100', /*画像のwidth（px）*/
 'thumbnail_height' => '100', /*画像のheight（px）*/
 'title_length' => '200', 
 'stats_category' => '0', 
 'post_html' => '<dl class="clearfix"><dt>{thumb}</dt><dd><h5>{title}</h5></dd></dl>',
 ); 
 wpp_get_mostpopular($wpp);
 ?>
 <?php else: ?>
 <?php
 wp_reset_query();
 $cat = get_the_category();
 $cat_id = $cat[0]->cat_ID;
 $cat_name = $cat[0]->cat_name;
 ?>
 <?php
 $wpp = array (
 'cat' => ''.$cat_id.'',
 'limit' => '6', 
 'range' => 'all',
 'order_by' => 'views',
 'post_type' => 'post',
 'stats_comments' => '0', 
 'stats_views' => '0', 
 'thumbnail_width' => '180', /*画像のwidth（px）*/
 'thumbnail_height' => '150', /*画像のheight（px）*/
 'title_length' => '200', 
 'stats_category' => '0', 
 'post_html' => '<dl class="clearfix"><dt>{thumb}</dt><dd><h5>{title}</h5></dd></dl>',
 ); 
 wpp_get_mostpopular($wpp);
 ?>
 <?php endif; ?>
 </div>

<!--カテゴリの人気記事を入れた場所ここまで-->

以上のコードをsingle.phpの自分が表示させたい場所に記載します。

それだけでも表示はされますが、
おそらくイビツかもしれません。

そういう場合はCSSで調整します。

目次に戻る

当ブログのCSSは以下になります。（参考までに）

/*カテゴリの人気記事を記事下ここから*/ #cateninki { padding-top: 10px; }/* タイトル名 */ #cateninki dd h5 { font-size: 16px; font-weight: bold; padding: 0px; margin-bottom: 5px; }#cateninki dt { float: left; width: 100px; }#cateninki dt img { width: 100px; }#cateninki dd { padding-left: 110px; }#cateninki dl { margin-bottom: 10px; padding-bottom: 10px; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #ccc; }#cateninki dl:last-child { margin-bottom: 20px; padding-bottom: 20px; border-style: none; }/*カテゴリの人気記事を記事下ここまで*/

すると、以下のように表示されるようになります。

これで、
同じカテゴリーに属する人気記事が表示させたい分だけ表示されるようになり、離脱率を低く出来るかもしれません。

お試しになってみて下さい。