WordPress Popular Postsを活用してサイドバーに人気記事を表示させる方法

サイドバーに、「人気記事ランキング」を表示させているサイトを見かけたことはありませんか?

人気記事ランキングは、「WordPress Popular Posts」というプラグインを活用することで、表示可能なんです。

この記事では、そんな「WordPress Popular Posts」の活用方法を解説していきます。

WordPress Popular Postsの設定方法

「WordPress Popular Posts」は冒頭でお伝えした通り、「人気記事ランキング」を表示するプラグインです。
しかも、単にランキングを表示させるだけでなく、記事のアイキャッチ画像や、アクセス数など、装飾も加えることができます。

WordPress Popular Postsの表示例

プラグインのインストールは、プラグイン検索画面にて行います。
「WordPress Popular Posts」と入力すると、以下のプラグインが出てくるのでインストールしてください。

WordPress Popular Posts

このプラグインを有効化し、具体的な設定に入ります。

WordPressプラグインのインストール方法は以下の記事を参考にしてください。

WordPress Popular Postsの設定画面への入り方

サイドメニューの「設定」「WordPress Popular Posts」とクリックします。

そして、「ツール」というタブをクリックします。

それでは、具体的な設定を行なっていきましょう。

サムネイル設定

まずは、サムネイル画像の設定です。
もし、サムネイル画像を人気記事ランキングに表示する場合は、ここで設定が必要になります。

それぞれの項目は、以下の日本語訳になっています。

WordPress Popular Postsのサムネイル設定画面

ここで特に設定しておきたいのが、「Pick image from」です。

「Pick image from(どの画像をサムネイルに表示するか)」ですが、基本的に3つの項目から選べます。

Featured image各投稿のアイキャッチ画像を表示
First image on post投稿内の最初の画像を表示
First attachment最初に添付されているファイルから表示
Custom fieldカスタムフィールド

普段、記事を投稿するときは、記事の内容に即したアイキャッチ画像を設定しているはずなので「Featured image(各投稿のアイキャッチ画像を表示)」を選択しておきましょう。

データ設定

データ設定は、基本的にこのままで大丈夫です。

WordPress Popular Postsのデータ設定

その他の設定

ここもそのままで大丈夫です。
もしも、ウィンドウの開き方でこだわりがあれば設定してみてください。

WordPress Popular Postsのその他の設定
スポンサードリンク

サイドバーに人気記事ランキングを追加する方法

続いて、「WordPress Popular Posts」をサイドバーに追加して、人気記事ランキングを表示します。

まずは設定画面に入りましょう。

「外観」「ウィジェット」をクリックします。

「利用できるウィジェット」から「WordPress Popular Posts」「サイドバー」にドラッグ&ドロップします。

WordPress Popular Postsをサイドバーに追加する方法

「▼」を押します。

上記の画面になったら、設定開始です。

タイトルと表示記事数

はじめに行う設定は、サイドバーに表示される、以下の項目になります。

  • タイトル
  • 表示する記事数
タイトル・表示数

続いて、並びを決める要素の「ソート順」を設定します。
ソート順

オススメは「総閲覧数」です。
今までの合計値から順番を決めてくれます。

対象期間と対象記事

次に設定する項目は、表示の対象となる期間や記事です。

計測期間記事の順位づけの要素
前項で決めたコメント数や閲覧数をどれだけの期間を対象とするかを選択します。
基本的には「全期間」で大丈夫です。
投稿タイプ人気記事の対象となるページを選択します。
以下のふたつから設定できます。

  • post(投稿ページ)
  • page(固定ページ)

ここでは、投稿ページのみ設定しておくことをお勧めします

続いて、以下の部分の説明です。

この部分では各記事やライター、カテゴリーごとに「表示 / 非表示」を決めることができます。
それぞれのIDの見つけ方ですが、「投稿」「投稿一覧」で、記事に矢印を当てると、以下のように左下にIDが表示されます。

個別投稿のIDの見つけ方

このID(数字のみ)を先ほどの項目に入力すると、個別に適用されます。
また、カテゴリIDは「投稿」「カテゴリ」から、個別ライターIDは「ユーザー」「ユーザー一覧」から、同様に確認してください。

表示方法・表示する情報

次は、それぞれのランキング内の表示方法の設定です。

自分が必要だなと感じる項目にチェックを入れておきましょう。

HTMLマークアップ設定

一度チェックを入れて「保存」をすると、以下のように表示されます。

htmlやcssの知識がある人は、この項目にも装飾のコードを入れてみてください。
分からない方は、チェックをはずしたままにしましょう。


いかがでしたか?

ところどころ複雑な部分がありますが、ブログ運営上そこまで重要なパーツではありませんので、分からなくて頭を抱えないようにしておいてくださいね。

以下の記事ではサイドバーの中に、より高度な装飾を加えるための方法をお伝えしています。

ぜひご覧ください!

スポンサードリンク