【ha-Basic】見ている記事と同一カテゴリーの人気記事一覧をサイドバーへ表示する方法
【この記事の目次】－ 必要な部分だけ見たいときにどうぞ － [表示する]
当サイトで配布させていただいている【ha-Basic】テーマには管理者以外、検索エンジンクローラー以外（100%ではありません）からページにアクセスされる度にアクセス数をカウントする独自の機能があります。
このデータは投稿の一覧、管理者権限でログイン時に限り各記事のタイトル下部分へ表示されるようになっており、管理者側から記事の人気度の把握ができるようになっています。
また、同じデータを元にサイドバーへサイト全体の記事の中から人気のある記事を表示する「人気記事ウィジェット」が標準で備わっており、記事ランキングを簡単に表示できるようにしています。
ただこのデータはテーマを有効化した以降の累計値なので、自身でしばらくこのテーマを運用していて「人気のある記事はそれほど変わらないからいつも同じものが表示されるなぁ・・・」と感じました。
そこで今回は一歩進めて今見ている記事が含まれるカテゴリーの人気記事一覧を作ろう！！をテーマに、一覧ウィジェットの作成方法を紹介したいと思います。
同一カテゴリー内人気記事ランキングウィジェットの作り方
管理画面から外観→テーマエディタを選択し、右の一覧から「insert-functions.php」を開いてください
以下のコードを末尾へ貼り付けて保存してください。
/* カテゴリーごとの人気記事一覧ウィジェット */
class SC_Popular_Posts extends WP_Widget {
/*コンストラクタ*/
function __construct() {
parent::__construct(
'sc_popular_posts',
'カテゴリー人気記事',
array( 'description' => 'PV数の多い順で記事を表示' )
);
}
/*ウィジェット追加画面でのカスタマイズ欄の追加*/
function form($instance) {
if(empty($instance['title'])) {
$instance['title'] = '';
}
if(empty($instance['number'])) {
$instance['number'] = 5;
}
?>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('タイトル:'); ?></label>
<input type="text" class="widefat" id="<?php echo $this->get_field_id('title'); ?>"
name="<?php echo $this->get_field_name('title'); ?>"
value="<?php echo esc_attr( $instance['title'] ); ?>">
</p>
<p>
<label for="<?php echo $this->get_field_id('number'); ?>"><?php _e('記事表示件数:'); ?></label>
<input type="text" id="<?php echo $this->get_field_id('limit'); ?>"
name="<?php echo $this->get_field_name('number'); ?>"
value="<?php echo esc_attr( $instance['number'] ); ?>" size="3">
</p>
<?php
}
/*カスタマイズ欄の入力内容が変更された場合の処理*/
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
$instance['number'] = is_numeric($new_instance['number']) ? $new_instance['number'] : 5;
return $instance;
}
/*ウィジェットのに出力される要素の設定*/
function widget($args, $instance) {
extract($args);
echo $before_widget;
if(!empty($instance['title'])) {
$title = apply_filters('widget_title', $instance['title'] );
}
if (!empty($title)) {
echo $before_title . $title . $after_title;
} else {
echo '<h4>人気記事</h4>';
}
$number = !empty($instance['number']) ? $instance['number'] : get_option('number');
?>
<aside class="sidekiji">
<ul>
<?php get_the_ID();//記事のPV情報を取得する
$categories = get_the_category($post->ID);
$category_ID = array();
foreach($categories as $category):
array_push( $category_ID, $category -> cat_ID);
endforeach ;
$args = array('meta_key'=> 'post_views_count',//投稿数をカウントするカスタムフィールド名
'orderby' => 'meta_value_num',
'category__in' => $category_ID,
'order' => 'DESC',
'posts_per_page' => $number
);
$my_query = new WP_Query( $args );?>
<?php while ( $my_query->have_posts() ) : $my_query->the_post(); $loopcounter++; ?>
<li>
<a href="<?php the_permalink(); ?>">
<!–順位–>
<span class="rank-count r-count<?php echo $loopcounter; ?>">
<?php echo $loopcounter; ?>
</span>
<!–サムネイル画像の追加–>
<?php if( has_post_thumbnail() ): ?>
<?php the_post_thumbnail(array(75,75)); ?>
<?php endif; ?>
<div class="sidekiji-text">
<?php the_title(); ?>
<br>
<!–カテゴリ–>
<span class="cat-data">
<?php if( has_category() ): ?>
<?php $postcat=get_the_category(); echo $postcat[0]->name; ?>
<?php endif; ?></span>
</div>
</a>
</li>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
</ul>
</aside>
<?php echo $after_widget;
}
}
register_widget('SC_Popular_Posts');保存したら外観→ウィジェットに新しく「カテゴリー人気記事」というのが追加されますので、任意の場所へ追加すれば完了です。
※固定ページやブログ一覧、アーカイブ一覧などのページにはカテゴリーという概念がありませんので、すべての記事の人気ランキングが表示されますので、通常の人気記事ウィジェットの代わりに使うか、併用する場合には以下のように記事ページのみへ表示するようにするといいかと思います。
個別記事以外で表示させる必要がないというときは
一番手っ取り早いのは
私のように「それだけにプラグイン使うのはどうも・・・」という方は以下の設定を行ってください。
※コード内に一か所修正しないといけない場所がありますので最後まで読んでください。
/*投稿のみ表示*/
function remove_specific_widget($sidebars_widgets){
if(!is_single() && !is_admin()){
foreach($sidebars_widgets as $widget_area => $widget_list){
foreach($widget_list as $pos => $widget_id){
if($widget_id=='sc_popular_posts-〇'){
unset($sidebars_widgets[$widget_area][$pos]);
}
}
}
}
return $sidebars_widgets;
}
add_filter('sidebars_widgets','remove_specific_widget');コード自体は検索していて見つけた
コードの簡単な説明をすると・・
if(!is_single() && !is_admin())コードに変更を加える点は中ほどにある
if($widget_id=='sc_popular_posts-〇'){sc_popular_posts-〇の部分。これはウィジェットIDになり同じ名前のウィジェットを追加したり削除したりするたびに〇部分の数字が変わってしまいますので、サイトの状況に合わせて変更が必要です。
今回のカスタマイズでコードを追加して最初に使ったウィジェットの場合は「1」で大丈夫なので一度試してみてください。
ウィジェットIDの調べ方
〇の部分を「1」にしても表示／非表示がうまく動作しない場合にはウィジェットIDを調べる必要があります。
ウィジェットIDを調べるには
表示画面の「カテゴリー人気記事」ウィジェットの上で右クリックし、検証をクリックします（デベロッパーツールを起動します）
画像のように「Elements」というのを選択すると下にコードがたくさん出てきますので、「sc_popular_posts-〇」という部分を探します。
ここに書かれている数字をコピーして先ほどのコードの〇へ貼り付ければOKです。
いかがでしたか？簡単に言えば実装されている「人気記事ウィジェット」にカテゴリーが含まれているものという条件を足したものを作り、単一記事ページでしか生じさせないで！という単純なものですが、PHP初心者の方にとってはすごくハードルの高いものかもしれませんので紹介させていただきました。こうしたコードの勉強を始めると本来の記事を書く作業がおろそかになりますので、さっとコピペして実装してくださいね。
いつでもご相談・サイトカスタマイズの依頼を受け付けています
Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。
※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちら
から登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。
【スポンサーリンク】
記事の拡散にご協力をお願いします
閲覧いただきありがとうございました。役に立つ情報でしたら是非SNSでシェアをお願いします