WordPressで表示回数に基づいて人気の投稿を表示する方法（2つの方法）

私たちの記事の最後にスクロールしたことがあるなら、おそらく「WPBeginnerで今人気！」ウィジェットに気づいたことがあるでしょう。この機能は読者に好評で、最も価値のあるコンテンツを発見するのに役立ち、さらに多くのサイトを探索することを奨励しています。

最も人気のあるWordPressブログ投稿を強調表示することで、読者が最高のコンテンツを見つけるのを助けるだけでなく、サイトのエンゲージメント指標も向上させます。訪問者は素晴らしいコンテンツを得られ、あなたは彼らをより長くサイトに留めることができるため、まさに一石二鳥です。

この記事では、WordPressで表示回数に基づいて最も人気のある投稿を簡単に表示する方法を説明します。

WordPressで表示回数に基づいて人気投稿を表示する理由

ユーザーが最も人気のあるWordPressブログ投稿を見ると、他の読者が最も気に入っているコンテンツを特定できます。これにより、それらの記事をチェックして会話に参加できます。

さらに、WordPressで最も人気のあるコンテンツを表示すると、ソーシャルプルーフを高めることができます。これは、新しいユーザーに「ねえ、他の人もこれらの投稿が本当に役立つと感じており、あなたもそうかもしれません！」と伝えているようなものです。

最後に、トレンドのブログ投稿を表示すると、ユーザーがウェブサイトに長く滞在するようになり、ページビューを増やし、直帰率を減らすことができます。

ユーザーエンゲージメントが高まるほど、Googleはコンテンツが良いもので重要であると判断します。その結果、WordPress SEOが改善され、サイトのランキングが向上する可能性があります。

残念ながら、WordPressにはページビュー数で最も人気のある投稿を表示するための組み込み機能やブロックはありません。このガイドでは、プラグインとコードを使用してまさにそれを行う方法を説明します。

好みの方法に直接ジャンプするには、以下のクイックリンクのいずれかをクリックしてください。

方法1：MonsterInsights で閲覧数による人気WordPress記事を表示する（推奨）

WordPressでビュー数に基づいて人気の投稿を表示する最も簡単な方法は、プラグインを使用することです。実際、利用可能なWordPressの人気投稿プラグインは多数ありますが、私たちの意見では、最良の選択肢はMonsterInsightsです。

世界中の300万以上のウェブサイトで使用されているMonsterInsightsは、WordPress向けの最高のGoogleアナリティクスプラグインです。主な機能はアナリティクスですが、最も人気のある投稿を表示するための使いやすい機能も備えています。

まず、MonsterInsightsプラグインをインストールし、Googleアナリティクスアカウントに接続する必要があります。詳細については、初心者向けのWordPressにGoogleアナリティクスをインストールする方法に関するステップバイステップガイドをご覧ください。

人気の投稿ウィジェットを選択 テーマ

プラグインをアクティブ化して設定したら、WordPressダッシュボードから**[Insights] » [Popular Posts]**に移動します。次に、[Popular Posts Widget]メニュー項目をクリックします。

下にスクロールすると、人気の投稿ウィジェットを表示するテーマを選択する必要があります。さまざまなオプションがあります。

一部には投稿のアイキャッチ画像が含まれていますが、よりミニマルなデザインのものもあります。

選択する前にテーマの外観を確認したい場合は、ページを下にスクロールして「テーマプレビュー」セクションに移動してください。

テーマをワイドまたはナロー形式でプレビューすることもできます。ワイド形式では、投稿がページまたは投稿コンテンツの下にリスト表示されますが、ナロー形式では、サイドバーのように投稿がその右側に表示されます。

次に、「デザインのカスタマイズ」セクションまでスクロールしましょう。ここでは、テーマの色、フォントサイズ、レイアウト、表示する投稿数を変更できます。

ここでのカスタマイズオプションは、使用しているテーマによって異なる場合があります。したがって、さまざまなテーマを探索して、最適なテーマを確認してください。

人気投稿ウィジェットの動作を設定する

テーマのデザインを設定したら、[動作]セクションに移動する必要があります。ここで、人気投稿ウィジェットがWordPressウェブサイトにどのように表示されるかを制御します。

ウィジェットのスタイリング設定では、上記で作成したデザインを使用するか、ウィジェットに全くスタイルを適用しないかを選択できます。後者のオプションを選択すると、ウィジェットはWordPressサイトのテーマのCSSに従います。

次に、ウィジェットが最も人気のある投稿をどのように選択するかを選択できます。このチュートリアルでは「キュレート」を選択しますが、コメント数に基づいて最も人気のある投稿を表示することもできます。

次に、その下にある「Googleアナリティクスからトップ5の投稿を追加」オプションを有効にする必要があります。ただし、それを行う前に、MonsterInsightsディメンションアドオンが必要であり、投稿タイプを新しいカスタムディメンションとして追加する必要があります。

これにより、MonsterInsights は Google Analytics のデータに基づいて最も人気のある投稿を選択できるようになります。

これを行うには、MonsterInsightsディメンションアドオンをダウンロードし、WordPressにプラグインとしてインストールする必要があります。ステップバイステップの手順については、WordPressプラグインのインストール方法に関するガイドをご覧ください。

次に、**インサイト »** **設定**に移動し、「コンバージョン」タブに切り替えます。その後、「新しいカスタムディメンションを追加」をクリックします。

それが完了したら、ドロップダウンメニューで「投稿タイプ」を選択します。

これにより、MonsterInsightsはブログ投稿やその他のカスタム投稿タイプのパフォーマンスを追跡できるようになります。

次に、インサイト » 人気の記事に戻り、「人気記事ウィジェット」に移動します。

「Google Analyticsからトップ5の投稿を追加」トグルボタンをアクティブにするだけです。次に、「自動投稿のテスト」をクリックして、セットアップが成功したかどうかを確認します。

はいの場合、成功メッセージのポップアップが表示されます。

次のように表示されるはずです。「人気の投稿データは正しく取得できます。注意：カスタムディメンションの設定をいつ行ったかによって、関連する人気の投稿データがGoogleアナリティクスから読み込まれるまで最大7日かかる場合があります。」

次のステップに進み、ウィジェットの上に表示されるタイトルを追加できます。「おすすめの人気投稿を見る」のようなものや、その他の類似したものでも構いません。

その下では、ウィジェットをすべての投稿タイプに表示するか、特定の投稿から除外するか、特定の投稿カテゴリにのみ表示するかを選択できます。

これらの設定は、ブログ記事以外のカスタム投稿タイプを作成した場合に、人気の投稿ウィジェットがそれらに無関係に見えると感じる場合に役立ちます。

最後のステップの1つは、人気投稿ウィジェットを埋め込むことです。いくつかのオプションがあります：自動的に配置する、Gutenbergブロックを使用する、サイドバーウィジェットとして追加する、またはショートコードを使用する。

各オプションを順番に見ていきましょう。

人気投稿ウィジェットを自動的に埋め込む

自動配置は、以前に設定した行動設定に一致するすべての投稿にウィジェットを表示したい場合に推奨されます。

これを行うには、自動配置ボタンを有効にするだけです。

このオプションの欠点は、投稿やページに最適なデザインに基づいてウィジェットのデザインを調整できないことです。この種の機能が必要な場合は、次の方法を試すことができます。

人気の投稿ブロックをページまたは投稿に埋め込む

ページや投稿でのウィジェットの外観をより細かく制御したい場合は、この方法が適しています。

まず、ウィジェットを表示したい投稿またはページのブロックエディターに移動します。その後、エディターのどこかで「+」ブロック追加ボタンをクリックし、「人気の投稿」ブロックを探します。

ブロック設定パネルでは、ウィジェットのテーマ、フォントサイズ、色、タイトル、レイアウト、投稿数を変更するオプションが表示されます。

これらの設定は、MonsterInsightsプラグインで見られたものと同様です。

唯一の違いは、ウィジェットでどの投稿が選択されるかを変更できないことです。

とはいえ、動作設定では、特定のカテゴリの投稿のみを表示することが可能です。これにより、人気の投稿の選択をニーズに合わせてより細かく調整できます。

ブロックの設定に満足したら、投稿やページの編集画面にある「更新」ボタンをクリックするだけです。

テストウェブサイトでの人気投稿ブロックは以下のようになります。

人気投稿ウィジェットをサイドバーに埋め込む

ウィジェット対応のサイドバー領域があるブロックを使用しないWordPressテーマを使用している場合は、人気の投稿ウィジェットをそこに追加できます。これは、私たちの「WordPressサイドバーに注目の投稿を追加する方法」の記事で行ったことです。

やるべきことは、外観 » ウィジェットに移動することです。次に、サイドバーエリアの「+」ウィジェット追加ボタンをクリックし、「人気投稿 – MonsterInsights」ウィジェットを探します。

前の方法と同様に、ウィジェットにはテーマの外観をカスタマイズするための同様の設定が含まれています。

違うのは、インターフェースが少し使いにくいことです。設定を変更しても、ウィジェットが実際にどのように見えるかを確認できません。プレビューするには、別のウィジェットまたは別の領域をクリックする必要があります。

ウィジェットの外観に満足したら、右上にある「更新」をクリックしてください。

サイドバーが正しく表示されているか、ウェブサイトで確認してください。

私たちのサイトは以下のようになっています：

人気の投稿ウィジェットを特定のページにのみ表示したい場合は、「WordPressの特定のページにウィジェットを表示または非表示にする方法」に関するガイドをお読みください。

ショートコードで人気投稿ウィジェットを埋め込む

最後のオプションはショートコードを使用することです。上記のオプションが特定のユースケースで機能しない場合は、この方法をお勧めします。

人気の投稿ウィジェットタブで、「埋め込みオプション」セクションまでスクロールします。次に、「ショートコードを使用して表示」を選択し、「ショートコードをコピー」ボタンをクリックします。

その後、ショートコードを好きな場所に配置するだけです。詳細については、「WordPressにショートコードを追加する方法」に関するガイドを確認してください。

方法2：コードで人気のWordPress投稿を表示する（より高度）

MonsterInsightsの方法は、WordPressで最も人気のある最高のコンテンツをビューで表示する最も簡単な方法です。しかし、コーディングに慣れている場合は、コードを使用して最も人気のあるWordPress投稿を表示することもできます。

この方法では、WPCodeのようなコードスニペットプラグインを使用することをお勧めします。これは、このガイドで使用するものです。

WPCodeを使用すると、WordPressファイルに直接触れることなくカスタムコードを安全に挿入できます。さらに、この方法では複数のコードスニペットを使用する必要があるため、プラグインを使用すると、それらをすべて管理および追跡するのがはるかに簡単になります。

まず、WordPressにWPCodeをインストールする必要があります。WPCodeの無料バージョンが利用可能ですが、正しい場所にコードを挿入するために必要な機能が付属しているため、Proバージョンを使用します。

ステップバイステップのインストールガイドについては、「WordPressプラグインのインストール方法」の記事をお読みください。

WordPress投稿ビューカウンター機能を追加

プラグインをアクティベートしたら、ダッシュボードからCode Snippets » + Add Snippet に移動する必要があります。次に、「Add Your Custom Code (New Snippet)」にカーソルを合わせ、「+ Add Custom Snippet」をクリックします。

これで、WPCodeコードスニペットエディター内にいます。コードを挿入する前に、スニペットにタイトルを追加してください。

この最初のコードには、「WordPress投稿ビューカウンター関数」のような名前を付けることができます。これは、この最初のコードの目的がWordPressで投稿ビューをカウントする関数を作成することだからです。

次に、コードタイプを「PHPスニペット」に変更します。この記事から追加するすべてのコードスニペットはPHPであることを覚えておいてください。

その後、以下のコードをコピーして貼り付けることができます。

function wpb_set_post_views($postID) {
    $count_key = 'wpb_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);
    }
}
//Get rid of prefetching to keep the count accurate
remove_action( 'wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);

次に、「挿入」セクションまでスクロールし、挿入方法で「自動挿入」、場所で「すべての場所に実行」を選択します。これは、コードをテーマのfunctions.phpファイルに挿入するのと同じように機能します。

その後、ページの右上隅に移動して、コードをアクティブにします。

次に、「スニペットを保存」をクリックします。

この段階で、別の新しいカスタムコードスニペットを追加する必要があります。このスニペットには「投稿表示回数関数呼び出し」という名前を付けることができます。

このコードは上記の関数を呼び出し、単一投稿ページでアクティブにします。

それが完了したら、次のスニペットをコピーして貼り付けます。

wpb_set_post_views(get_the_ID());

このコードスニペットの違いは、単一の投稿ページで実行されるため、場所として「投稿の後で挿入」を選択することです。

完了したら、コードをアクティブにして保存してください。

WordPress投稿ビューのトラッキングフックを挿入

次に、現在のページが単一の投稿であるかどうかを確認する新しいコードスニペットを追加する必要があります。もしそうであれば、WordPressの投稿表示回数カウンター関数を呼び出して、投稿の表示回数を追跡および更新します。

この方法で、ユーザーが投稿を訪問するたびに、その閲覧数が更新されます。

このスニペットに「WordPress投稿ビュー追跡フック」という名前を付けます。次に、次のコード行を挿入します。

function wpb_track_post_views ($post_id) {
    if ( !is_single() ) return;
    if ( empty ( $post_id) ) {
        global $post;
        $post_id = $post->ID;    
    }
    wpb_set_post_views($post_id);
}
add_action( 'wp_head', 'wpb_track_post_views');

挿入方法を「自動挿入」、場所を「フロントエンドのみ」として選択できます。

前の手順と同様に、コードをアクティブ化してスニペットを保存してください。

投稿ビュー数を取得し、表示回数付きの人気投稿を表示する関数を追加する

このガイドの最終段階に入りました。特定のWordPress投稿のビュー数を取得してフォーマットするコードスニペットを追加する必要があります。これは、後で最も閲覧された投稿のリストを表示する際に役立ちます。

このコードを「投稿ビュー数取得関数」と名付け、場所を「どこでも実行」に設定できます。

コードスニペットはこちらです。

function wpb_get_post_views($postID){
    $count_key = 'wpb_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';
}

再度、WPCodeでコードをアクティブにし、保存することを忘れないでください。

それが完了したら、新しいコードスニペットを再度作成し、「最も人気のある投稿を表示（ビュー数付き）」という名前を付けます。これは、ブログ記事の下部に最も人気のある投稿を表示するコードです。

コードプレビューボックスに、次のスニペットを挿入します。

// Customize the query parameters as needed
$popularpost = new WP_Query( array(
    'posts_per_page' => 3,         // Feel free to adjust the number of posts to display
    'meta_key' => 'wpb_post_views_count',
    'orderby' => 'meta_value_num',
    'order' => 'DESC'
));
?>

<div class="popular-posts">
    <h2>See Our Most Popular Posts</h2> <!-- Feel free to customize the title -->
    <ul>

    <?php while ( $popularpost->have_posts() ) : $popularpost->the_post(); ?>
        <li>
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            - <?php echo wpb_get_post_views(get_the_ID()); ?>
        </li>
    <?php endwhile; ?>

    </ul>
</div>

<?php wp_reset_postdata(); 

コードに記載されているように、表示する投稿の数を自由に調整し、このセクションのタイトルをカスタマイズしてください。

WPCode挿入セクションで、場所として「投稿の後で挿入」を選択してください。次に、コードをアクティブにしてスニペットを保存します。

あとは、ブログ記事のいずれかを訪問して、コードが機能するかどうかを確認するだけです。こちらが、テスト用のWordPressブログで最も閲覧数の多い記事セクションがどのように表示されるかです。

動画チュートリアル

視覚的な指示をご希望の場合は、以下のチュートリアルのビデオ版をご覧ください。

このWordPressチュートリアルが、閲覧数で人気のある記事を表示する方法を学ぶのに役立ったことを願っています。また、WordPressのベスト関連投稿プラグインの専門家による選択や、コンバージョン率の高いランディングページとは何かについての記事もご覧ください。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterやFacebookでも私たちを見つけることができます。