WordPress Popular Posts ショートコードで人気ランキングを表示する

WordPress Popular Postsとは

WordPress Popular Posts（以下wppと記す）は、サイドバーやフッターにウィジェットで、サイト内の記事を人気順（閲覧数やコメント数順）にランキング表示できるWordPressのプラグインです。

ウィジェットでは非常に多くの方が利用していますが、wppの「ショートコード」を活用すれば、投稿記事中にランキング表示したり、固定ページにランキングページを作成することが簡単にできます。

これから紹介する方法は、「WordPress Popular Posts」のインストールが必要です。こちらを参考にインストールして下さい。

wppのショートコードで人気ランキングを表示する

wppショートコードのパラメータ

パラメータの詳細は、「管理画面」の「設定」＞「Wordpress Popular Posts」から「パラメータ」タブで確認できます。よく使うものは以下のとおりです。

パラメータ	説明	デフォルト値
header	表題	Popular Posts
header_start	表題の開始タグ	<h2>
header_end	表題の終了タグ	</h2>
limit	表示件数	10
range	集計期間（”daily”, “weekly”, “monthly”, “all”）	daily
order_by	ソート順 “comments”, “views”, “avg” (1日の平均閲覧数)	views
post_type	投稿タイプ　投稿(post), 固定ページ(page)	post,page
cat	カテゴリーID（”1,55,-74″）マイナスは除外の意	－
title_length	記事タイトルの最大表示文字数	25
thumbnail_width	サムネイル画像の幅	15
thumbnail_height	サムネイル画像の高さ	15
wpp_start	リストの開始タグ	<ul>
wpp_end	リストの終了タグ	</ul>
stats_views	閲覧数を表示(1), 非表示(0)	表示(1)
stats_comments	コメント数を表示(1), 非表示(0)	非表示(0)

デフォルト設定［wpp］でランキングを表示してみる

記事内でショートコードを使うには、「wpp」を[]で囲み記事内の表示させたい場所に記述します。パラメータをなにも指定しないデフォルト設定では、

• ソート順 閲覧数（views）
• 集計単位 1日（daily）
• 表示件数 10
• 閲覧数を表示（stats_views=1）

になります。

表示サンプル

パラメータを設定してランキングらしく表示を整える

表題を表示するなど、パラメータを設定してランキングらしく表示を整えます。パラメータの設定は、下記のように「wpp＋表示したい項目」で表示したい項目や形式を指定します。

ショートコード

【パラメータの説明】

• 表題（header=”人気ランキング”、h4タグ）
• 集計期間 過去1ヵ月間で（range=”monthly”）
• 一日平均の閲覧数の多い順（order_by=”avg”）
• 固定ページは含めずに（post_type=”post”）
• 表示件数最大8件まで（limit=8）
• 記事タイトルの表示文字数は最大35文字まで（title_length=35）
• 閲覧数を表示し（stats_views=1）
• ランキングらしくリスト記号を番号表記にする（<ul> → <ol>）

表示サンプル

ランキング表示らしくなりました。表題に＜h4＞タグを指定したので、ページの＜h4＞見出し項目と同じデザインで表示されます。

リスト表示を横並び表示に変更する

ページトップにも表示できるよう、CSSを使ってリスト表示を横並び１行表示に変更します。

記事本文中に、ショートコード版のコードを記述するか、Simplicityをご利用の方は、「投稿本文上」のウィジェットエリアに「テキスト」ウィジェットを設定して、その中にこのショートコードを記述すれば、すべての投稿記事のページトップに人気ランキングが表示されるので便利です。

表示がブログ横幅内に１行で収まらないときは、CSSのwidth、margin-right、font-sizeで調整するか、表示件数を減らしてご利用ください。

ソースコード（ショートコード版）

• 表題（週間人気ランキング TOP 5）
• 表示件数最大5件まで（limit=5）
• 集計期間 1週間（range=”weekly”）
• 固定ページはランキングしない（post_type=”post”）
• 30ｘ30pxのサムネイル付き（thumbnail_width=30 thumbnail_height=30）
• 閲覧数を表示しない（stats_views=0）

表示サンプル

サムネイル付の横並び１行で表示したサンプルは下記のようになります。

（参考）ソースコード（PHP版）

header.php、footer.phpや、投稿ページsingle.php、固定ページpage.phpなどのテンプレートファイルに直接記述する場合は、PHP版のコードを使います。

ショートコード版との違いは、

• ショートコード版：ショートコードタグ［wpp パラメーター］
• PHP版：テンプレートタグ <?php wpp_get_mostpopular(‘パラメーター’); ?>

と、ショートコードタグで記述するか、テンプレートタグで記述するか、です。

カテゴリー別人気ランキングをショートコードで表示する

「カテゴリー別」の人気ランキングを表示するためには、ユーザーが閲覧中のページのカテゴリーをその都度取得する必要があります。

記事やウィジェットには PHP プログラムを書くことができないので、このページの「人気ランキング」のように直接記事中に、ショートコードを書くことができません。

解決方法には、次の２通りがあります。

1. PHP版をショートコード化し、記事にショートコードタグを書く
2. single.phpなどのテンプレートファイルに、直接 PHP版を記述する

こちらのコードは、１つのコードで、カテゴリーのあるページには「カテゴリー別ランキング」、ないページには「全記事のランキング」を自動で切り替えて表示します。具体的にはこちらをご覧ください。

WordPress 関連 おススメ記事

• インストール
  1. 初心者でも簡単にできる WordPress のインストール方法
  2. WordPress のプラグインをインストールする方法
  3. WordPress のバージョンアップと自動更新
• 設定・カスタマイズ
  1. WordPress をインストールしたら最初に行いたい設定おススメ
  2. WordPress のカテゴリとアーカイブの記事数を表示する方法
  3. WordPress のリビジョン・自動保存機能を停止する方法
  4. WordPress のタイトル画像の挿入とランダム表示
• 使い方
  1. WordPress にYouTube動画やGoogleマップなどのメディアを表示する
• エラー対処
  1. WordPress で画面が真っ白になってしまった場合の３つの対処法みんな読んでます
  2. WordPress の自動アップグレード中にメンテナンス中エラー表示がでた時の対処
• バックアップ・復元
  1. WordPressの「インポート/エクスポート」を使ってサイトをバックアップし復元みんな読んでます
  2. phpMyAdminを使ってMySQLのデータをバックアップ・復元する方法おススメ
• データベース
  1. WordPress データベーステーブルの接頭辞を変更する方法
• ウィジェット
  1. WordPress4.8のテキストウィジェットの自動整形機能を無効化する方法New
  2. ウィジェットの作り方：新着・更新記事のウィジェット化と子テーマ運用
  3. Simplicityに「新着・人気記事」ウイジェットを設置する
  4. ウィジェットの作り方：新着・更新記事のウィジェットの機能追加おススメ
  5. WoerPress ウィジェッ トのタグクラウドのカスタマイズ方法
  6. WordPress のメタ情報の不要項目を非表示にする３つの方法
• ショートコード
  1. WordPress Popular Posts ショートコードでカテゴリー別人気ランキングを表示
  2. WordPress Popular Posts ショートコードで人気ランキングを表示するおススメ
  3. WordPress テキストウィジェットでショートコードを使う方法
  4. 自作ショートコードで記事・固定ページにPHPファイル（定型文）をインクルード
• プラグイン
  1. 自動目次生成プラグインTable of Contents Plusの設定と使い方
  2. WordPress Popular Postsの活用：閲覧数、人気ランキングを表示する
  3. 標準プラグインAkismetでスパム対策を行う