JOURNAL クリエイティブとマーケティングの話

WordPressでプラグインを使わずに人気記事一覧を表示する方法

WordPress Popular Posts』というプラグインを使えば、WordPressで人気記事を簡単に表示することができます。

このプラグインではサムネイル画像の表示など詳細な設定ができるため、大抵の場合はこれを使えば問題はないと思います。

とはいえ、なるべくプラグインを使いたくない、テーマの方に組み込んで余計な設定の手間を省きたいというようなケースもあると思います。

ということで今回は、WordPressでプラグインを使わずに人気記事一覧を表示する方法をご紹介します。

はじめに言っておくと、ここでご紹介するソースのほとんどはGoogleで「WordPress 人気記事 プラグインなし」などで検索すれば同じようなのが出てきます。

一番分かりやすかったのは本記事末尾に記載した参考ページ①で、人気記事を取得する方法に加え、検索エンジンクローラーや自分がWordPressにログインしているときのアクセスをカウントから除外する方法についても書かれています。

ただこの記事ではタイトル通り「アクセス数を管理画面に表示する手順」を紹介されていますので、ここでは紹介されているソースを叩き台にして、ページ上に人気記事を表示する手順を書いていきたいと思います。

WordPressでプラグインを使わずに人気記事一覧を表示する方法

記事閲覧数を取得する

まず、記事閲覧数をカウントするための関数を作成します。

テーマ内のfunctions.phpに下記のコードを追記します。

functions.php
/* 人気記事一覧
---------------------------------------------------------- */
//記事閲覧数を取得する
function getPostViews($postID){
  $count_key = 'post_views_count';
  $count = get_post_meta($postID, $count_key, true);
  if($count==''){
    delete_post_meta($postID, $count_key);
    add_post_meta($postID, $count_key, '0');
    return "0 View";
  }
  return $count.' Views';
}
//記事閲覧数を保存する
function setPostViews($postID) {
  $count_key = 'post_views_count';
  $count = get_post_meta($postID, $count_key, true);
  if($count==''){
    $count = 0;
    delete_post_meta($postID, $count_key);
    add_post_meta($postID, $count_key, '0');
  }else{
    $count++;
    update_post_meta($postID, $count_key, $count);
  }
}
//headに出力されるタグを削除(閲覧数を重複してカウントするのを防止するため)
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

このコードは本記事末尾の参考②で紹介されているもので、「getPostViews」という閲覧数を取得する関数を作成し、「setPostViews」で閲覧数をカウント、「post_views_count」というカスタムフィールドに閲覧数を保存しています。

「headに出力されるタグを削除~」となっている部分については未検証なのですが、参考ページのコメントを読む限りではhead要素内に出力される「前後ページへのリンク」のmetaタグが原因で閲覧数が重複してカウントされてしまうようなので、それを防ぐために該当のmetaタグを削除しているということのようです。

Hi Andrew, is likely prefetching, or the setViews is added more than once. To solve the one issue try adding this. Note the code above.

// Remove issues with prefetching adding extra views
remove_action( ‘wp_head’, ‘adjacent_posts_rel_link_wp_head’, 10, 0);

投稿の閲覧数をカウントする

記事の閲覧数を取得する設定ができたので、次はその閲覧数を基準に記事を一覧表示していきます。

しかしその前に、より正確な閲覧数を取得するために、検索エンジンのクローラーによるアクセスと自分のアクセスをカウントから除外する処理を追加したいと思います。

まずクローラーによるアクセスを判別するため、下記のコードをfunctions.phpに追記します。

functions.php
//クローラーのアクセス判別
function is_bot() {
  $ua = $SERVER[HTTP_USER_AGENT];
  $bot = array(
    "googlebot",
    "msnbot",
    "yahoo"
  );
  foreach( $bot as $bot ) {
    if (stripos( $ua, $bot ) !== false){
      return true;
    }
  }
  return false;
}

参考ページ①で紹介されているソースそのままですが、これでGoogle、MSN、Yahoo!のクローラーによるアクセスを判別する「is_bot」という関数を作成できました。

次に自分のアクセスを判別する方法ですが、これは閲覧者がWordPressにログインしているかをチェックするis_user_logged_inという関数を使います。

この「is_bot」と「is_user_logged_in」という2つの関数を使い、single.phpに下記のように記述してクローラーと自分のアクセスを除外します。

single.php
<?php
  if( !is_user_logged_in() && !is_bot() ) { //クローラーとログイン時のアクセスをカウントから除外
    setPostViews( get_the_ID() );
  }
?>

ループ内に記述する必要があるので、僕の場合は下記のようにしてループ開始直後に閲覧数をカウントするようにしています(ループ内であればどこでもいいので、同じように書く必要はありません)。

<?php
  if(have_posts()) : while(have_posts()) : the_post();
  if( !is_user_logged_in() && !is_bot() ) { //クローラーとログイン時のアクセスを閲覧数カウントから除外
    setPostViews( get_the_ID() );
  }
?>

人気記事一覧を表示する

ここまでで投稿の閲覧数を取得し保存する設定と、投稿の閲覧数をカウントするための設定を行いました。

最後にこれまでに設定した閲覧数取得の仕組みを利用して、人気記事一覧を表示します。

テーマ内の人気記事一覧を表示したい箇所に下記のように追記してください。

ここではサイドバー(sidebar.php)に表示することを想定して「side_menu」というクラスを付与したulタグの中にliタグで人気記事のタイトルをリスト表示しています。

sidebar.php
<ul class="side_menu">
<?php
	setPostViews(get_the_ID());
	query_posts('meta_key=post_views_count&orderby=meta_value_num&posts_per_page=10&order=DESC');
	while(have_posts()) : the_post();
?>

<li><a href="<?php the_permalink(); ?>"><?php
if(mb_strlen($post->post_title)>30):
	$title= mb_substr($post->post_title,0,30) ; echo $title. ・・・ ;
else:
	echo $post->post_title;
endif;
?></a></li>

<?php endwhile; ?>
<?php wp_reset_postdata(); wp_reset_query(); ?>
</ul>

query_postsで投稿の抽出条件を指定しています。

「post_views_count」は上で作成した「getPostViews」という関数で取得した閲覧数を格納しているカスタムフィールドです。

「meta_key=post_views_count」でカスタムフィールド「post_views_count」の値を取得します。

その値を参照して「orderby=meta_value_num」と「order=DESC」で上から値(閲覧数)の大きい順に、10件(posts_per_page=10)表示しています。

まとめ

以上、WordPressでプラグインを使わずに人気記事一覧を表示する方法でした。

作業手順としては、

  • functions.phpに閲覧数を取得&保存するための関数を作成する
  • single.phpでクローラーと自分のアクセスを除外する設定をする
  • 人気記事一覧を表示したい箇所にループを設置する

という流れです。別にクローラーのアクセスとか気にしないという場合には、2の作業を省いてしまうのもアリです(正確性は落ちますが)。