Simple GA RankingでWordPressに人気記事を表示

ブログの宿命として、古い記事はなかなかアクセスしにくい所に追いやられてしまいます。
検索エンジンもクロールしにくくなり、昔は上位表示された記事もそのうち検索順位も落ちてしまうかもしれません。

昔書いた記事を風化させないように、当ブログではサイドバーに人気記事を表示することにしました。

人気記事を表示させるにあたって検討した項目は以下です。

  1. 使っているテーマにあうよう、なるべく自由に表示をカスタマイズできる
  2. あまり重くない(Google Analyticsやデータベースへのアクセスは最小限)
  3. なるべく簡単にできること

最初は有名なWordPress Popular Postを少し使ってみました。カスタマイズ性もそこそこ高いのですが、関数の引数にパラメーターとしてリストの開始タグや終了タグ、サムネイルの有無やサイズ等々を渡して、HTMLを出力するという方式がどうも気に入らず。

Google Analytics APIを使って取得する方法も見つけました。が、毎回Analytics APIにアクセスして表示させるならともかく、一日一回キャッシュして、それを表示させるのはちょっと大変そうなのでパス。

そこで見つけたのがSimple GA Rankingです。

Simple GA Ranking

Google Analytics のデータをもとに、記事のランキングを取得できます。
ショートコードで記事をリストで出力することもできますし、記事のpost idを取得してそれを使って自分で好きなように表示をカスタマイズすることもできます。

さらにWordPressのTransient APIを使って、キャッシュまでしてくれます。
時間のかかる、Google Analyticsへの問い合わせは24時間に１度だけですみます。
Google Analytics APIには１日のアクセス数制限がありますが、それも気にする必要がなくなります。

注意点としてはPHP5.4以上でないとGoogle AnalyticsのOAuth用のプラグインが動かないようです。
PHP5.3以下を使っている場合はPHPのアップグレード、もしくはプラグインの編集が必要になります。

Simple GA Rankingの設定

Simple GA Rankingの設定自体はその名の通り、シンプルです。
ランキングを集計する日数と表示数を設定するだけです。

ですが、Google Analytics APIとの連携が少し分かりにくい(というか説明が無い)ので、ご紹介しようと思います。

Google Analytics APIとの連携

Analytics APIとの連携は設定メニューの「Analytics設定」から行います。

この画面のコールバックURLを設定した、クライアントIDとコンシューマーシークレットをGoogle Developersから取得する必要があります。

Google Developersでアカウントを作成し、Google Developers Consoleで、新規プロジェクトを作成します。

「APIと認証」の「API」からAnalytics APIを検索し、有効にします。

「APIと認証」の「認証」からOAuthの新しいクライアントIDを作成します。

ウェブアプリケーションを選択し、同意画面を設定します。

 

同意画面は認証の際に、自分に表示される画面なので、サービス名のみ適当に入力しておきます。

承認済みのリダイレクトURLのところに、「Analytics設定」メニューのコールバックURLを入力します。

 

これでクライアントIDとクライアント（コンシュマー）シークレットが作成されました。
この２つを「Analytics設定」メニューに入力し、トークンを取得します。

 

以上でGoogle Analyticsとの連携は終了です。
これでSimple GA Rankingを使って人気記事のランキングを取得できます。

Simple GA Rankingを使用した人気記事の表示

あとはsga_ranking_get_dateを使用して、ランキングを取得します。
(今気づきましたが、get_dataではなくget_dateなんですね。)

例えば、Stingerの新着記事と同じフォーマットにするには以下のようなPHPを作成します。

<div id="kanren">
<?php if (function_exists('sga_ranking_get_date'))
  $ranking = sga_ranking_get_date();
else
  $ranking = array(824,26,52,488,23);
  $args = array(
  'post__in' => $ranking,
  'posts_per_page' => 5,
  'orderby' => 'post__in');
  $my_query = new WP_Query($args);
  if($my_query->have_posts()):
  while ($my_query->have_posts()) : $my_query->the_post(); ?>
<dl class="clearfix">
  <dt><a href="<?php the_permalink() ?>" >
  <?php if ( has_post_thumbnail() ): // サムネイルを持っているときの処理 ?>
  <?php the_post_thumbnail( 'thumb150' ,array( 'alt' =>get_the_title())); ?>
  <?php else: // サムネイルを持っていないときの処理 ?>
  <img src="<?php echo get_template_directory_uri(); ?>/images/no-img.png" alt="<?php the_title(); ?>"  width="100" height="100" />
  <?php endif; ?>
</a> </dt>
<dd>
  <h5><a href="<?php the_permalink(); ?>">
  <?php the_title(); ?>
</a></h5>
<div class="smanone">
  <?php the_excerpt(); //スマートフォンには表示しない抜粋文 ?>
</div>
</dd>
</dl>
<?php endwhile; endif; ?>
<?php  wp_reset_postdata(); ?>
</div>

簡単に解説すると、

<?php if (function_exists('sga_ranking_get_date'))
  $ranking = sga_ranking_get_date();
else
  $ranking = array(824,26,52,488,23);

でランキングを取得。
プラグインがオフになっていたりして、Simple GA Rankingが使用できない場合は、表示させたいpost idを使用しています。

  $args = array(
  'post__in' => $ranking,
  'posts_per_page' => 5,
  'orderby' => 'post__in');
  $my_query = new WP_Query($args);

でランキングの順に記事を取得します。
ループで記事を毎回取得するのではなく、データベースのアクセスを減らすため、記事取得は一回のqueryで行った方がよいです。

まとめ

以上でSimple GA Rankingを使用して、人気記事の表示ができます。
当ブログではトップページの１ページ目は新着記事の替わりに、それ以外には新着記事の下に表示させることにしました。

テーマに合わせて人気記事を表示させたい場合には、動作も軽く、導入も比較的簡単なのでお勧めです。

 

モバイルバージョンを終了