2022.6.9|WordPress

WordPress(ワードプレス)でプラグインなしで人気の記事を表示する実装方法

WordPress(ワードプレス)でプラグインなしで人気の記事を表示する実装方法

WordPress(ワードプレス)で制作したWebサイトの各投稿記事がどれだけ閲覧されていて、どの記事がよく読まれているのかを一覧表示することができます。WordPress(ワードプレス)では、「よく読まれている記事」や「人気の記事」をランキング順に一覧で実装することができます。「よく読まれている記事」や「人気の記事」は、プラグインで実装する方法とプラグインなしで実装する方法があります。

今回は、WordPress(ワードプレス)でプラグインなしで人気の記事を表示する実装方法を解説します。

プラグインなしで人気の記事を表示する実装方法

プラグインなしで「人気の記事」を表示する実装する場合は、記事がどのくらい読まれているかを把握するために記事のアクセス数(ページビュー数)を計測する必要があります。各記事のアクセス数(ページビュー数)をカウントし人気の記事の一覧として出力・表示します。
「人気の記事」は、プラグインを導入することで実装する事ができますが、プラグインなしで実装する方法があります。「人気の記事」を表示させるためには、「functions.php」「single.php」ファイルにアクセス数(ページビュー数)を計測するコードを記述し、「sidebar.php」ファイルなど出力を行いたい場所に表示するためのコードを記述することで実装ができます。

WordPress(ワードプレス)でプラグインなしで人気の記事を表示する実装方法

1.記事のアクセス数(ページビュー数)を計測

記事のアクセス数(ページビュー数)を計測するために、「functions.php」ファイルにコードを記述する必要があります。「post_views_count」関数を記述してアクセスカウントを取得します。
サーバーにインストールされたWordPressの「テーマ」ファイルから「functions.php」ファイルを探します。
「functions.php」ファイルを開いて必要なコードを記述し、保存を行ったファイルをサーバーにアップロードします。

アクセス数を計測するコード
// 記事のPVを取得
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';
}

// 記事のPVをカウントする
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);
  }
}
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

2.記事のアクセス数(ページビュー数)を取得

「functions.php」ファイルと同様に記事のアクセス数(ページビュー数)を取得するために、「single.php」ファイルにコードを記述する必要があります。サーバーにインストールされたWordPressの「テーマ」ファイルから「single.php」ファイルを探します。
「single.php」ファイルを開いて必要なコードを記述し、保存を行ったファイルをサーバーにアップロードします。

アクセス数(ページビュー数)を取得するコード
<?php
    // 記事のビュー数を更新
    if (!is_user_logged_in() && !is_robots()) {
      setPostViews(get_the_ID());
    }
?>

3.「人気の記事」を出力

「人気の記事」を出力するために、「sidebar.php」ファイルなど「人気の記事一覧」を出力した個所に表示するコードを記述する必要があります。サーバーにインストールされたWordPressの「テーマ」ファイルから「sidebar.php」ファイルを探します。
「sidebar.php」ファイルを開いて必要なコードを記述し、保存を行ったファイルをサーバーにアップロードします。

「人気記事」を出力するコード

※「posts_per_page」属性で表示数を指定します。

<div>
<ul>
<?php
    $args = array(
      'post_type' => 'post',
      'meta_key' => 'post_views_count',
      'orderby' => 'meta_value_num',
      'posts_per_page' => 5,
      'order'=>'DESC',
    );
    $the_view_query = new WP_Query( $args );
    if ($the_view_query->have_posts()):
      while($the_view_query->have_posts()): $the_view_query->the_post();
 ?>
<li><a href="<?php the_permalink(); ?>"><?php if (has_post_thumbnail()) : ?>
<?php the_post_thumbnail('thumbnail'); ?>
<?php else : ?>
<img src="<?php echo esc_url( home_url( '/' ) ); ?>img/no_report.jpg" alt="<?php the_title(); ?>">
<?php endif ; ?><h6><?php the_title(); ?></h6></a></li>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
</ul>
</div>

まとめ

「よく読まれている記事」や「人気の記事」はユーザビリティ向上の対策となります。訪問ユーザーが多い記事ほどユーザーが読みたい情報なので、「人気の記事」を実装することでアクセス数(ページビュー数)UPを見込めます。
ひとつの記事を閲覧したユーザーにとって次にどのページを読みたくなるか、次はどんな記事が気になるかを予測することでWebサイトの最適化に繋がります。