はぴすぷ

人気記事ランキングを表示する必須のWordPressプラグイン【WordPress Popular Posts】の導入手順

      2015/09/22

ずっと入れたいと思っていた、人気記事のランキングを表示してくれるWordPressプラグイン「WordPress Popular Posts」をやっと導入出来ました！

結構影響範囲でかそうでローカルで試してバックアップ取ってからしか入れられないなーと、準備してました(；・∀・)

皆さんもプラグインの導入前には、ローカルでのテストと、バックアップはしっかり取っておきましょうね！手順書いていってるので是非参考にして下さい。
WordPressを自分のPCに設置する方法【XAMPPを使ってローカル開発】
【WordPress】簡単なバックアップの取り方と復旧の方法【初心者向け】

スポンサーリンク

WordPress Popular Postsとは

このキャプチャの右側にある、「本日の人気記事」とかで、アクセス数とかコメント数が多い順に表示してくれるWordPressのプラグインです。
ランキングはデイリー、ウィークリー、マンスリー、トータルの4パターンで集計ができます。

SS_0659_0

導入することによるメリット

評価の高い記事か、興味を引くタイトルの記事への導線が常に表示されるので、最初に何か記事を読んでみようというきっかけに大いに役立ちます。
もし、そこで気に入って貰えれば、ランキング内の次の記事、次の記事と多くのページビューを稼ぎます。
その流れで質の高いコンテンツを読んでもらえれば、拡散してくれた上に、ファンになってくれるかもしれません。
やはり新着と検索流入だけではなかなか次の1記事が難しいです。

まとめると、こんな感じです。

  • 直帰率が下がる。
  • ページビューが伸びる。
  • 拡散率が上がる。
  • リピート率が上がる。

いいこと尽くしですね！

導入することによるデメリット

実際に導入してみるとかなり柔軟に設定が出来て、自分好みにカスタマイズがしやすいです。

メリットがものすごい大きいんですが、デメリットもすごい大きいんです。

何が困るかと言うと、サーバーへの負担が激増します。

私のところみたいな弱小ブログでは大したことはないんですが、記事数も多く、アクセスが多い場合はサーバーが耐えられなくなるでしょう。

リアルタイムランキングは巨大なサイトであればある程大変なんです。

ランキングのあるソーシャルゲームなどをやっていた方なら分かると思いますが、1時間毎くらいにしか数値が変動しません。1秒間に何十もアクセスがあって、その度に再度計算していてはCPUの処理が追いつかないからです。

なので、1度計算した結果を一定時間覚えておいて、その間は再計算せずにそのまま返すという実装をしています。
元ソシャゲ開発してた私がソースです(^q^)

WordPressの高速化の為にも使われていて、キャッシュ系のプラグインを入れることで、本来のWordPressであれば結構大きいサイトでも月1000円とかの格安共用サーバーで捌けたりします。

記事を更新しない限り、ページ全体のキャッシュが効くので、htmlファイル返してるのとほぼ同じ感じになるんです。

でも今回紹介するWordPress Popular Postsはキャッシュ系プラグインとの相性は最悪らしいので、そこそこのサイトでも結構いいお値段するサーバーに引っ越さないと対処できなくなる時期が来るかもしれません。

でもその時が来たら無効にするだけで大丈夫なので、入れてみて問題なければ是非導入することをおすすめします。

追加されるテーブル

まず初期のWordPressのデータベースにはアクセス数などの情報は持っていません。
じゃあなぜアクセス数のランキングが作れるのかというと、WordPress Popular Postsを追加した時に2つのテーブルが作成されるからです。

ちなみにテーブルの中身確認してみたらこんな感じでした。

こっちが各記事のトータル表示数。トータルはこっちを即返せる。

SS_0660

こっちが各記事の各日に対する表示数。こっちは範囲絞って集計する必要あり。
もしかしたら1ヶ月過ぎたら使うことないのでレコード消されるかもしれない。

SS_0661

どうやらソース見てみると、dataとsummaruyの他にも、datacache、datacache_backup、logのテーブルが作られる可能性がありそう。もしかしたらキャッシュして負荷抑える仕組みあるのかも(；・∀・)

WordPress Popular Postsの導入方法

管理画面のプラグインから新規追加をクリック。

SS_0662

そしてWordPress Popular Postsで検索すると表示されるので、いますぐインストールをクリック。

SS_0651

インストールが完了したらプラグインを有効化をクリック。

SS_0652

WordPress Popular Postsの設定例

WordPress Popular Postsの設定画面。

SS_0654_0

肝心のウィジェット埋め込みの設定画面。

SS_0656

…。なんで全部英語やのん(´・ω・｀)

WordPress Popular Postsの日本語化

どこかで日本語の設定画面みたことがあったので検索してみる。

発見！
人気記事表示プラグイン『WordPress Popular Posts』

ありがたく使わせていただきます。

初のプラグイン日本語化！！

手順は簡単。プラグインのlangディレクトリに突っ込むだけ。

SS_0663_0

これで日本語化されてるはず！

WordPressPopularPosts0

されてるけど中途半端(´・ω・｀)

日本語化されてない部分の説明しときますね。

基本設定

WordPressPopularPosts1

  • Title：一覧の見出し。
  • Show up to：一覧に表示する記事の数。
  • Sort posts by：並び順。コメント数、累計閲覧数、1日の平均の閲覧数から選択。

Filters

WordPressPopularPosts2

  • Time Range：集計の期間。24時間、7日間、30日間、累計から選択。
    • Display only posts ～：チェックを付けると集計の期間に投稿された記事のみ集計の対象になる。
  • Post type：集計する投稿の種類。postが投稿で、pageが固定ページ。post,pageで両方。
  • Post ID to exclude：表示させない投稿のID。複数指定はコンマ区切り。
  • Category ID：表示させるカテゴリID。表示させたくない時は頭にマイナス(-)。複数は上に同じ。
  • Author ID：表示させる投稿者ID。上と同じ。

記事設定

ここから下の部分はチェックボックスにチェックして一度保存しないと詳細が設定できません。
タイトルの文字数と記事の要約はレイアウトによって、指定した文字数と一致しないことが多いです。

WordPressPopularPosts3

統計用タグ設定

タイトルの後にごちゃごちゃ付きます。

WordPressPopularPosts4

  • Display category：カテゴリを表示する。

HTMLマークアップ設定

自分でタイトルの前後やリストの構造を変えたりも出来る。

WordPressPopularPosts5

うーんテキストに起こしたけど分かり辛かったから画像加工した(´・ω・｀)
それでも分からんけどｗ

以上、ウィジェットの設定についてでした。

CSSの調整

STINGGER5と同じ感じにしたので、大体はコピーして適用。
IDとクラスの厳密さ加減がどう指定したら勝ってくれるのかよく分からない…。

/* LI - Post container styles */
#side aside .wpp-list li {
    overflow:hidden;
    float:none;
    clear:both;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #ccc;
}
#side aside .wpp-list li:last-child {
    border-style: none;
}
    /* Thumbnail styles */
    .wpp-thumbnail {
        display:inline;
        float:left;
        margin:0 10px 0 0;
        border:none;
    }

    /* Title styles */
    .wpp-post-title {
        font-size: 16px;
        font-weight: bold;
        padding: 0px;
        margin-bottom: 5px;
        color: #333;
        text-decoration: none;
    }
    .wpp-post-title:hover {
        color: #b22222;
    }

おわりに

ようやくWordPress Popular Posts入れれて大満足です！
過去のアナリティクスのデータとかをカウントに反映させようと思ったけどめんどくさそうなのでこのままでいいかなｗ

まだ、本来表示させたかった場所に出せれてないのと、スタイルが思い通りになっていないので、まだ調整が必要そうです。

最近はブログ用に画像編集することが多くなってきたので、良い画像編集ソフトが欲しくなってきました。いろんなソフトが進化してるから、きっと最新のPhotoshopとかも凄いんだろうなと勝手に思ってます。それにAdobeのソフトで全く知らないソフトがどんどん増えてて、どんなものなのかずっと気になってるんですよね。

ブログ書くネタがなくなった時に使ってみることにしてみます(・∀・)

 - STINGER, WordPress, プラグイン