Webサイトによくある「人気のある記事一覧」。
WordPressで実現させるためには、「WordPress Popular Posts」というプラグインを使うことで実装することができます。
そこで今回は、「WordPress Popular Posts」の使い方を紹介します。
CONTENTS
WordPress Popular Postsとは？
「WordPress Popular Posts」は、ページビューの多い記事を表示できるプラグインです。
このプラグインを使うことで、難しいコードを書かなくてもサイトの中に追加することができます。
https://ja.wordpress.org/plugins/wordpress-popular-posts/
人気にある記事を表示するプラグインは他にも様々なプラグインが用意されていますが、代表的なプラグインが「WordPress Popular Posts」です。
評価も高く、頻繁に更新されているので、安心して利用できます。
サイトバーに実装するためにはプラグインの設定だけでなく、ウィジェットの設定が必要になります。ウィジェットについて詳しく知りたいという方はこちらの記事をご覧ください。
WordPress Popular Postsの使い方と設定方法
「WordPress Popular Posts」の使い方と設定方法をお伝えします。
今回説明することは、プラグインのインストールと有効化をした後にやるべきことになります。説明を読み始める前に、プラグインのインストールと有効化をしておきましょう。
日本語化させる
「WordPress Popular Posts」は、デフォルトの状態だと英語表記になっています。英語のままだとうまく使いこなせる自信がないという方も多いのではないでしょうか？
WordPressでよく使われるプラグインは日本語化するための翻訳ファイルが用意されています。「WordPress Popular Posts」もその一つです。用意されたファイルを使って日本語化させていきます。
手順は以下の3つがあります。
- 翻訳ファイルをダウンロードする
- ダウンロードしたファイルを解凍する
- 翻訳ファイルをアップロードする
1．翻訳ファイルをダウンロードする
まずは以下のURLから日本語の翻訳ファイルをダウンロードしましょう。
http://pasonal.com/wordpress-popular-posts-jp-download/
2．ダウンロードしたファイルを解凍する
ダウンロードしたファイルは、zip形式になっているので解凍しておきましょう。
3．翻訳ファイルをアップロードする
解凍後、翻訳ファイルはFTPソフトを使ってアップロードします。
アップロードする場所は、WordPressをインストールしたディレクトリの「wp-content/languages/plugins/」の中に入れてください。
その後、WordPressを再読み込みさせましょう。問題なく日本語で表示されればOKです。
固定ページに表示させる
「WordPress Popular Posts」は、固定ページでも表示させることができます。その方法について紹介します。
まずは、WordPressの管理画面から「固定ページ」→「新規追加」をクリックしましょう。「テキスト」に以下のコードをコピペしてください。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
[wpp range="monthly" order_by="views" limit=30 thumbnail_width=120 thumbnail_height=120 excerpt_format=0 excerpt_length=120 wpp_start='<ol class="wpp-list2">' wpp_end="</ol>" post_html='<li style="list-style:none;border-bottom:1px gray dotted;"><p style="margin-right:1em;float:left">{thumb}</p><p><b><a href="{url}">{text_title}</a></b><br /><span>{summary}</span></p><p style="clear:both"></p></li>'] <style> .wpp-list2{ margin: 0!important; counter-reset: no; } .wpp-list2 li:before{ content: counter(no); counter-increment: no; color: white; /*文字色*/ background-color: black; /*背景色*/ text-align: center; opacity: .999; float: left; line-height: 30px; width: 30px; height: 30px; border-radius: 2px; -moz-border-radius: 2px; margin-right: -25px; } </style> |
CSSはstyleタグの中に書き込むことで、デザインをカスタマイズできます。
コード部分の項目は以下の意味を表しています。
- range：集計期間（「daily」、「weekly」、「monthly」、「all」）
- order_by：集計方法（「comments」、「views」、「avg」）
- limit：表示する順位（何位まで表示するのか）
- pid：除外する記事番号
- cat：特定のカテゴリのランキングを表示する（カテゴリIDを指定する）
- thumbnail_width：サムネイルの幅（単位：px）
- thumbnail_height：サムネイルの高さ（単位：px）
- except_format：抜粋する文にhtmlの装飾やリンクを反映する（1：反映させる、0：反映させない）
- except_length：抜粋する文の文字数
例えば、「range=weekly」にすると1週間の中での人気記事ランキングを表示できます。また、「limit=10」にすると人気のある記事を10位まで表示できます。
WordPress Popular Postsをカスタマイズする方法
ここからは「WordPress Popular Posts」のカスタマイズ方法をお伝えします。
任意の箇所に設置する
任意の箇所に設置する方法としては、以下の3つの方法があります。
- ウィジェットを使用する
- ショートコードを使用する
- PHPファイルにテンプレートタグを記述する
それぞれの場合の表示方法をお伝えします。
ウィジェットを使って表示させる
ウィジェットを使うことでサイドバーに簡単に表示することができます。
管理画面を表示した上で、「外観」→「ウィジェット」をクリックすると、ウィジェットの設定画面が表示されます。
サイドバーウィジェットや固定ページ、フッターなどそれぞれの場所ごとにドラッグアンドドロップでどの項目を追加するのか設定することができます。
「▼」をクリックすると以下のように、集計期間などの細かな設定をすることができます。
ショートコードを使って表示させる
ショートコードを使うことでサイドバーではなく、投稿記事の中に表示することができます。
「WordPress Popular Posts」のショートコードのパラメータは、WordPressの「設定」→「WordPress Popular Posts」→「パラメータ」で以下のように確認することができます。
ここに表示されているパラメータを使って記述していきます。ショートコードを記述する際には、「テキスト」にしてから記述してくださいね。
PHPファイルにテンプレートタグを記述する
PHPの知識がないと難しい操作になるので、上の2つの方法に比べて少し難易度が高くなります。ただし、上の2つよりは自由にレイアウトを設定することができるので、場合によっては設定しやすくなることもあります。
とは言っても、「固定ページに表示させる」で紹介したショートコードに似たようなコードを記述するだけなので、基本的にパラメータはコピペでOKです。
まずはテンプレートタグの基本形を紹介します。
|
1 |
「( )」の中でパラメータに値を与えることによって表示を変えることができます。パラメータを複数設定する場合は、以下のように記述します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
それぞれのパラメータは以下のような意味を示しています。（最後の行で設定したパラメータを表示しています。）
- range：集計期間
- limit：最大記事表示数
- post_type：投稿記事のみ表示する（固定ページは表示しない）
- title_length：タイトルの文字数上限
- stats_comments：コメント数を表示させるか（0：非表示、1：表示する）
- stats_views：閲覧数を表示させるか（0：非表示、1：表示する）
- thumbnail_width：サムネイル画像のwidth（単位：px）
- thumbnail_height：サムネイル画像のheight（単位：px）
- post_html：表示されるhtmlの設定（ランキングで表示する順番）
WordPress Popular Postsのトラブル対応方法
「WordPress Popular Posts」の設定は簡単ですが、ときどきトラブルが起こってしまうことがあります。
そんなときの対処法を紹介します。
サムネイルが表示されない
アイキャッチ画像を新しく指定しても画像の更新がされなくなってしまうことがあります。
その原因は、「WordPress Popular Posts」のプラグイン自体がキャッシュを持っていて、最初にアイキャッチに指定した画像ファイルを独自のディレクトリにコピーしてしまうことが原因です。
簡単に言うと、高速で表示するために画像ファイルをコピーしているのです。このキャッシュをクリアすることで対処することができます。
まずは、管理画面の「設定」→「WordPress Popular Posts」をクリックして、「WordPress Popular Posts」の設定画面に移りましょう。
「ツール」というタブをクリックして「Data（データ）」の中にある「画像キャッシュを空にする」をクリックしてください。
「Success!」というメッセージが表示されると、キャッシュが消去されます。
「権限のエラーで消去できない」といったメッセージが表示された場合は、「WordPress Popular Posts」の独自ディレクトリに書き込み権限があるか確認してみてください。
ページビューがカウントされない
「WordPress Popular Posts」には、閲覧数をカウントしてくれる機能があります。しかし、この機能が正しく動作せず、カウントされないことがあります。
考えられる原因は、以下の3つなどが挙げられます。
- プラグインの設定が正しくできていない
- ページキャッシュが利用されている
- 「wp-admin」のアクセス規制を行っている
場合によって考えられる原因は変わりますが、その中でも特に起こりやすいプラグインの設定についてお伝えします。
プラグインの設定が正しくできていない場合
まずはプラグインの設定を確認してみましょう。
設定の確認は、管理画面→「設定」→「WordPress Popular Posts」の「ツール」タブで確認することができます。
この中の「Log views from:（閲覧を記録する対象者）」を確認してみましょう。
- Visitors only（訪問者のみ）：訪問者のみカウントする（ログインユーザーはカウントしない）
- Logged-in users only（ログインユーザーのみ）：ログインユーザーのみカウントする（訪問者はカウントしない）
- Everyone（全員）：すべてのユーザーをカウントする
これが適切な設定になっているかを確認してみましょう。
「Sorry. No data so far.（データがない）」と表示される
このような事象は、「WP Super Cache」などのキャッシュ系のプラグインを使っているときにときどき起こることがあります。
対処法は、以下の3つが挙げられます。
- Ajaxを使うウィジェットを有効にする
- ウィジェットではなくテンプレートタグを使う
- 他のプラグインが影響を及ぼしていないかを確認する
使っているテーマやプラグインによって同じように設定しても思い通りにいかないことがあります。1つずつ試してみてください。
Ajaxを使うウィジェットを有効にする
「WordPress Popular Posts」の設定画面を開き、「ツール」タブを選択します。「Data」の中にある「Ajaxfy widget（ウィジェットをAJAX化）」を「Enable（有効）」に変更して、「Apply」をクリックすると有効化されます。
この操作をすると改善されることがあります。
ウィジェットではなくテンプレートタグを使う
先ほど紹介したテンプレートタグを使うことで改善されることもあります。
1つ目の方法でうまく対処することができなかった場合は、ウィジェットではなくテンプレートタグを使ってみましょう。
また、テンプレートタグにすることでより細かなカスタマイズができるようになります。
他のプラグインが影響を及ぼしていないかを確認する
複数のプラグインを使っているとよく起こります。
「WordPress Popular Posts」の公式サイトにも「キャッシュ系プラグインを使っている場合は一度キャッシュを削除してみてください」という記述があります。
「WP Super Cache」などのキャッシュ系のプラグインを使っている場合は一度キャッシュを削除してから行いましょう。
サイトが重くなったときは？
「WordPress Popular Posts」は、人気のある記事をランキング形式で表示してくれる便利なプラグインです。
しかし、長く使っているサイトやアクセス数の多いサイトで使用するとデータ量や計算処理が増えるため、ページの表示が重くなってしまいます。
そんなときには以下の3つの方法を試してみましょう。
- 「WPP Cache Expiry Policy」の有効化
- Data Sampling
- データベースの削除
「WPP Cache Expiry Policy」の有効化
これは、キャッシュの有効時間を設定するためのものです。設定した有効期限の期間のランキングを集計し、表示します。
デフォルトでは、「Never cache（無効）」になっているので有効化します。アクセス数が多いサイトになるほど効果が高いです。
アクセス数が多いサイトではこの設定を行っておくことをおすすめします。
Data Sampling
閲覧者のアクセス情報のデータ収集方法を変更するためのものです。
デフォルトでは、全てのアクセスデータを収集しているので、閲覧者が多いサイトではどうしても負荷が高くなりがちです。
「Enabled（許可）」にすることで、一部のデータだけを収集することができます。そのため、負荷を軽減することができます。
ただし、一部のデータだけを収集することになるので、正確なデータではなくなってしまいますが…
データベースの削除
長く使っていると、どうしてもデータベースが大きくなりがちです。場合によっては、レンタルサーバー会社から警告のメールが届くことがあります。
そんなときは、データベースの中のキャッシュだけを消したい場合は「Empty cache」をクリックしましょう。また、「Clear all data」をクリックすることですべてのデータが削除されます。
WordPress Popular Postsの使い方まとめ
いかがでしたか？
今回は、「WordPress Popular Posts」の使い方についてお伝えしました。便利なプラグインですが、データベースに負荷がかかりやすいので注意が必要です。
最後まで読んでいただき、ありがとうございました。
オンラインマンツーマンならCodeCamp
CodeCampは期間限定でWordpressコースを提供していますが、上場企業のグループ会社が運営していることもあり、これまでに2万人以上の受講実績があります。
プログラミング未経験者でも、WordPressのインストール、サーバーの準備、テーマの設定、プラグインの導入など、WordPressでサイトを構築するためのスキルを身につけることができます。
オンラインテキストを自習形式ならTechAcademy
基礎的なPHPの知識に加えて、サイト制作における企画・設計・制作・運用方法、WordPressテーマのカスタマイズ方法、プラグインを利用した機能の追加方法、オリジナルWordPressテーマの作成方法などを学ぶことができます。
TECH ACADEMYでは申込みから1週間の間、オンライン教材・メンターによるサポート等の学習システムを無料で体験することも可能です。
