興味のある所からお読み下さい
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)
になります。
表示サンプル
- 安全で覚えやすいID/パスワードの作り方
- XREAドメインメールのカスタムフィルターの使い方とスパムメール対策
- WordPressバージョン情報とテーマの名前・バージョンの表示方法
- WordPressのメタ情報の不要項目を非表示にする3つの方法
- phpMyAdminを使ってMySQLのデータをバックアップ・復元する方法
- WordPress Popular Posts ショートコードで人気ランキングを表示する
- WordPress の乗っ取り・改ざんを防ぐためのセキュリティ対策法
- WordPress 4.8のテキストウィジェットの自動整形機能を無効化する方法
- WordPress Popular Posts ショートコードでカテゴリー別人気ランキングを表示する
- ウィジェットの作り方:新着・更新記事のウィジェット化と子テーマ運用
パラメータを設定してランキングらしく表示を整える
表題を表示するなど、パラメータを設定してランキングらしく表示を整えます。パラメータの設定は、下記のように「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>見出し項目と同じデザインで表示されます。
人気ランキング
- 安全で覚えやすいID/パスワードの作り方...
- phpMyAdminを使ってMySQLのデータをバックアップ・復元する...
- WordPress Popular Posts ショートコードで人気ラ...
- XREAドメインメールのカスタムフィルターの使い方とスパムメール対策...
- WordPressの「インポート/エクスポート」を使ってサイトをバック...
- WordPressのメタ情報の不要項目を非表示にする3つの方法...
- 自動目次生成プラグインTable of Contents Plusの設...
- 当サイトで行っているWordPress/Simplicityの各種設定...
リスト表示を横並び表示に変更する
ページトップにも表示できるよう、CSSを使ってリスト表示を横並び1行表示に変更します。
記事本文中に、ショートコード版のコードを記述するか、Simplicityをご利用の方は、「投稿本文上」のウィジェットエリアに「テキスト」ウィジェットを設定して、その中にこのショートコードを記述すれば、すべての投稿記事のページトップに人気ランキングが表示されるので便利です。
表示がブログ横幅内に1行で収まらないときは、CSSのwidth、margin-right、font-sizeで調整するか、表示件数を減らしてご利用ください。
ソースコード(ショートコード版)
- 表題(週間人気ランキング TOP 5)
- 表示件数最大5件まで(limit=5)
- 集計期間 1週間(range=”weekly”)
- 固定ページはランキングしない(post_type=”post”)
- 30x30pxのサムネイル付き(thumbnail_width=30 thumbnail_height=30)
- 閲覧数を表示しない(stats_views=0)
<style type="text/css"> div.mywpp li { display: inline-block; vertical-align: top; width: 9em; margin-right: 5px; font-size: 13px; line-height: 1em; } </style> <div class="mywpp"> <table><tr> <th><span><a href="http://wp.kikuchisan.net/wpp-cat-shortcode.html">by ブログ工房</a> </span>週間人気ランキング TOP 5</th> </tr><tr> <td>
安全で覚えやすいID/パスワードの作り方 WordPress Popular Posts ショートコードで人気ランキングを表示する phpMyAdminを使ってMySQLのデータをバックアップ・復元する方法 XREAドメインメールのカスタムフィルターの使い方とスパムメール対策 WordPressのメタ情報の不要項目を非表示にする3つの方法
表示サンプル
サムネイル付の横並び1行で表示したサンプルは下記のようになります。
by ブログ工房 週間人気ランキング TOP 5 |
---|
(参考)ソースコード(PHP版)
header.php、footer.phpや、投稿ページsingle.php、固定ページpage.phpなどのテンプレートファイルに直接記述する場合は、PHP版のコードを使います。
ショートコード版との違いは、
- ショートコード版:ショートコードタグ[wpp パラメーター]
- PHP版:テンプレートタグ <?php wpp_get_mostpopular(‘パラメーター’); ?>
と、ショートコードタグで記述するか、テンプレートタグで記述するか、です。
<style type="text/css"> div.mywpp li { display: inline-block; vertical-align: top; width: 9em; margin-right: 5px; font-size: 13px; line-height: 1em; } </style> <div class="mywpp"> <table><tr> <th><span><a href="http://wp.kikuchisan.net/wpp-cat-shortcode.html">by ブログ工房</a> </span>週間人気ランキング TOP 5</th> </tr><tr> <td><?php wpp_get_mostpopular('limit=5&range="weekly"&post_type="post"&thumbnail_width=30&thumbnail_height=30&stats_views=0'); ?></td> </tr></table> </div>
カテゴリー別人気ランキングをショートコードで表示する
「カテゴリー別」の人気ランキングを表示するためには、ユーザーが閲覧中のページのカテゴリーをその都度取得する必要があります。
記事やウィジェットには PHP プログラムを書くことができないので、このページの「人気ランキング」のように直接記事中に、ショートコードを書くことができません。
解決方法には、次の2通りがあります。
- PHP版をショートコード化し、記事にショートコードタグを書く
- single.phpなどのテンプレートファイルに、直接 PHP版を記述する
こちらのコードは、1つのコードで、カテゴリーのあるページには「カテゴリー別ランキング」、ないページには「全記事のランキング」を自動で切り替えて表示します。具体的にはこちらをご覧ください。
WordPress 関連 おススメ記事
- インストール
- 設定・カスタマイズ
- 使い方
- エラー対処
- バックアップ・復元
- データベース
- ウィジェット
- ショートコード
- プラグイン