人気記事の一覧を表示する!(WordPress Popular Posts)

WordPressのテーマ「Diver」を使用してWordPressサイトをカスタマイズします。本稿では、サイドバーにアクセスランキング(人気の記事)を表示します。

プラグイン「WordPress Popular Posts」をインストールする!

Diverでは、サイドバーにアクセスランキングを表示させるのに「WordPress Popular Posts」を使用することが想定されています。まずは、プラグイン「WordPress Popular Posts」をインストールして、有効化しましょう。

人気記事の一覧をサイドバーに表示する!

ウィジェットの設定画面から、「WordPress Popular Posts」をサイドバーに設定して、アクセスランキングを表示します。本サイトは、以下の項目を設定しています。アイキャッチ画像のサイズは、サイドバーに表示する画像の標準のサイズに合わせますが、くっきりした画像にするために、「WordPress Popular Posts」では、縦横倍のサイズにして、CSSで目的のサイズに表示します。

  • タイトル:人気の記事
  • 最大表示件数:10
  • 計測期間:過去1週間
  • アイキャッチ画像を表示:有効
  • サイズを手動で設定:有効(幅:200px,高さ:160px)

以下は、CSSの設定です。

img.wpp-thumbnail {
    width: 100px;
    height: 80px;
}

人気記事の一覧を固定記事に表示する!

ウィジェットだけでなく、固定ページに表示することもできます。固定ページを作成し、ショートコードで表示します。

「WordPress Popular Posts」の表示をDiverからカスタマイズする!

カスタマイズ画面から、「デザイン設定②」を表示します。最後の設定に「ランキングウィジェット順位」という項目があります。ここで、ランキング番号の表示方法について選択できます。本サイトは、デフォルトの「丸」から「四角」に変更しています。

おわりに

Diverで、アクセスランキング(人気の記事)を表示するには、プラグイン「WordPress Popular Posts」を使用するのがおすすめです。