[WP] 人気記事ランキングに “Simple GA Ranking” を使う方法

スポンサーリンク
スポンサーリンク
プログラム→HTML

WordPressの人気記事ランキングを生成するプラグインと言えば “WordPress Popular Posts” が有名ですが、このプラグインはサーバー負荷が高く、記事数やアクセス数が多くなると負荷を無視できなくなってしまいます。そのため、サーバー負荷がより少ない “Simple GA Ranking” に乗り換えてみました。

Simple GA Rankingとは?

WordPressのプラグイン “Simple GA Ranking” は、Googleアナリティクスの解析結果を元に人気記事ランキングを生成してくれます。

WordPress Popular Postsは自前でアクセスをカウントする関係上、アクセスごとにデータベースへの処理が発生してしまいます。そのため、アクセスが増えれば増えるほど処理が多くなり高負荷となってしまいます。

しかし、Simple GA RankingはGoogleアナリティクスの解析結果を用いるので、自前でカウントする必要は無く低負荷となっています。

もともと、Googleアナリティクスを使用しているのであれば、そのデータを利用するだけなので合理的でしょう。

Simple GA Rankingの使いかた

Simple GA Rankingを使うためには、Google APIの “クライアントID” と “コンシューマーシークレット” を取得する必要があります。

Google Analytics設定

  1. メニューの “設定” より『Analytics設定』をクリックします。

    WordPress→設定→Analytics設定

  2. Google Analytics設定より『Google API Console』をクリックします。

    WordPress→設定→Analytics設定

    この時、別タブ(別ウィンドウ)で開くと便利です。
  3. Google APIより『プロジェクトを選択』をクリックします。

    Google API

  4. 選択より『+』をクリックします。

    Google API→プロジェクトの選択

  5. 新しいプロジェクトより “プロジェクト名” を入力の上で『作成』をクリックします。

    Google API→プロジェクトの選択→新しいプロジェクト

  6. 選択より『(作成したプロジェクト)』をクリックします。

    Google API→プロジェクトの選択

  7. Google APIより『Analytics API』をクリックします。

    Google API

  8. Analytics APIより『有効にする』をクリックします。

    Google API→Analytics API

  9. Analytics APIより『認証情報を作成』をクリックします。

    Google API→Analytics API

  10. 認証情報より『クライアントID』をクリックします。

    Google API→Analytics API

  11. クライアントIDの作成より『同意画面を設定』をクリックします。

    Google API→Analytics API

  12. 認証情報のOAuth同意画面より “ユーザーに表示するサービス名” を必須入力、その他の任意入力し『保存』をクリックします。

    Google API→Analytics API

  13. クライアントIDの作成より “ウェブアプリケーション” を選択し “名前” と “承認済みのリダイレクトURL” を入力したら『作成』をクリックします。

    Google API→Analytics API

    承認済みのリダイレクトURLとは、WordPressの “Google Analytics設定” 画面に表示されています。
  14. 表示OAuthクライアントより “クライアントID” と “クライアントシークレット” をコピーします。

    Google API→Analytics API

  15. WordPressのGoogle Analytics設定に戻り “クライアントID” と “クライアントシークレット” を入力し『トークンを取得』をクリックします。

    WordPress→設定→Analytics設定

  16. サイトの設定より “統計データを利用するアカウント” を選択し『保存』をクリックします。

    WordPress→設定→Analytics設定

Simple GA Rankingの設定

  1. メニューの “設定” より『Simple GA Ranking』をクリックします。

    WordPress→設定→Analytics設定

  2. Simple GA Rankingより “本日から何日前までのランキングを表示させるか” と “表示数” を入力し『保存』をクリックします。

    WordPress→設定→Simple GA Ranking

サイトに掲載するには?

設定を終え、ウィジェット “Simple GA Ranking” をサイドバーなどに設定すれば、人気ランキングを掲載することができます。ただ、デフォルトだとデザインが少々味気ないので、サイトのデザインに合わせてカスタマイズをオススメします。

今回は例として、当サイトでも利用しているテーマ “Simplicity” での “人気記事” で表示される「サムネイル付きの一覧」を作成してみました。

ショートコードの作成

テーマ “Simplicity” の “人気記事” と同じサムネイル付きの一覧を生成するショートコード [my_ga_ranking] を作成するため、functions.phpに対してコードを追記します。

add_shortcode('my_ga_ranking', 'exec_my_ga_ranking');
function exec_my_ga_ranking() {
  if (function_exists('sga_ranking_get_date')) {
    $ranking_data = sga_ranking_get_date();
    if ( !empty( $ranking_data ) ) {
      $ret = '';
      $ret .= '<div class="widget_popular_ranking"><ul class="wpp-list">';
      foreach ( $ranking_data as $post_id ) {
        $post_thumb = "";
        if( has_post_thumbnail( $post_id ) ) {
          $post_thumb_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post_id ),array( 100, 100 ) );
          $post_thumb = $post_thumb_src[0];
        }
        $ret .= '<li><a href="' . esc_attr(get_permalink($post_id)) . '" title="' . esc_html(get_the_title($post_id)) . '" target="_self"><img src="' . $post_thumb . '" width="75" height="75" title="' . esc_html(get_the_title($post_id)) . '" alt="' . esc_html(get_the_title($post_id)) . '" class="wpp-thumbnail wpp_cached_thumb wpp_featured" /></a> <a href="' . esc_attr(get_permalink($post_id)) . '" title="' . esc_html(get_the_title($post_id)) . '" class="wpp-post-title" target="_self">' . esc_html(get_the_title($post_id)) . '</a></li>';
      }
      $ret .= '</ul><div class="clear"></div></div>';
    }
  }

	return $ret;
}
functions.phpの編集を誤ると、画面が真っ白になって操作不能になるので注意してください。
掲載コードを流用する場合には御自身で充分にテストし自己責任で使用してください。何がおきても一切の責任は負いません。

ウィジェットに貼り付ける

作成したショートコード [my_ga_ranking] を “テキストウィジェット” を用いてサイドバーなどに貼り付けます。

WordPress→外観→ウィジェット

すると、WordPress Popular Postsで生成される人気記事ランキングと同じように表示されます。

mtfield.net→人気記事

Simple GA Rankingは初期設定も面倒ですが、利用テーマに合わせて表示させるのも骨が折れました。しかし、出来上がってしまえば、サーバー負荷もほとんどなく快適に利用できておりオススメです。

スポンサーリンク

シェアする