Google Analyticsからデータを取得してアクセスカウンターに表示する方法

  • このエントリーをはてなブックマークに追加

こんにちわ。WordPressでブログを運営中の「ヒロユキ」と申します。

今回、自分のサイトにGoogle Analyticsからデータを取得してアクセス数を表示するウィジェットを作成したのでソースなどを公開したいと思います。

Google Analyticsからデータを取得するメリット

まず、アクセスカウンターを何故配置しようかと思ったかですが、1つはブログの権威性をユーザーに示すためです

読者は自分が参考にしているサイトがどの程度信頼できるかということが気になるかと思いますが、アクセス数は一つの目安になるかと思うので、公開しておくと読者も安心できる可能性があります。

(ちなみに、現在の自分のブログのアクセス数は非常に低いため逆効果な可能性も高いです…)

もう1つは単純に自分がブログを開いた時に、どの程度アクセスが有ったか見たいためです。いちいちAnalyticsを見に行くのは面倒なので。

アクセスカウンターを表示するサービスは色々あるし、自作するにしても「 WordPress Popular Posts 」などの投稿数をサマリーするほうが楽です。

では何故Analyticsより取得するかと言うと、単純に自分のアクセスを除外したいから です。

「 Googleアナリティクス オプトアウト 」を使えば簡単に自分のアクセスを除外できるため、より正確な値をカウンターとして使用することが出来ます。

また アクセスカウンターを表示するサービス を利用すると、 Analyticsと2重管理になり面倒くさいので Analytics から取得するようにした次第です。

Google APIを使用する準備までが面倒

ソースを書くのより、むしろ前準備でGoogleの設定をする方が面倒です…。

実施した手順を書いていきたいと思います。

プロジェクトを作成する

1.https://console.cloud.google.com/にアクセス

2.「IAMと管理」→「IAM」から+ボタンをクリックして、プロジェクトを作成

3.適当なプロジェクト名を入れて作成ボタンをクリック

クライアントIDを作成する

1. https://console.developers.google.com/にアクセス

2.「認証情報」から認証情報作成→サービスアカウントキーの順にクリックする

3.適当な情報を入れて作成をクリックする

キータイプはP12とJSONのどちらでも良いかと思いますが、JSONが推奨らしいのでJSONにしました。(上の画像だとP12を選択していますが…)

作成をクリックするとJSONファイルのダウンロードが始まります。これは後々使うので無くさないようにします。

役割はオーナーにしましたが、今回の操作であれば閲覧者で十分そうですね。

プロジェクトで Analytics Reporting APIを有効にする

1.ライブラリを選択する

2.検索バーに「Analytics Reporting API」を入力し有効化する

Google Analyticsのビュー権限を追加する

1.Analyticsの管理→ビューから「ユーザー管理を表示」をクリック

2.作成したクライアントIDを閲覧者で追加します


これでやっとGoogle側の準備が完了です!!

ここまではHPcodeさんのブログ等を参考にしながら進めました。


ライブラリをサーバーにアップする

次にAPIのライブラリを入手して、自分のサーバーにアップします。

1.以下のURLからライブラリを取得

https://github.com/googleapis/google-api-php-client/releases

私は、現時点で最新のgoogle-api-php-client-2.4.0_PHP54.zipをダウンロードしました。

2.ZIPを解凍して、FTPなどを使用してWordPressのサーバーにアップロード

3.ついでに「クライアントIDを作成する」で作成したJSONファイルもサーバにアップ ロード

ビューIDを確認する

ソースを書く前に、ソースに記載する必要がある AnalyticsのビューIDを確認しておきます。

管理→ビューの設定から確認することが出来ます。

functions.phpにアクセスカウンタのウィジェットを追加

ここまで来てやっとコーディングです。

今回はウィジェットとしてアクセスカウンタを追加するので、functions.phpにソースを追加します。

require_once('lib/googleapi/google-api-php-client-2.4.0_PHP54/vendor/autoload.php');
class counterWidget extends WP_Widget{
 
    function __construct(){
        parent::__construct(
      'widget_counter',
      'アクセスカウンタ',        
            array('description' => 'アクセスカウンタを表示するウィジェットです')
        );
    }
 
    public function widget($args, $instance){
    
    $title = apply_filters( 'widget_title', empty( $instance['title'] ) ? '' : $instance['title'], $instance, $this->id_base );
        
     // クライアントID
    $client_id = 'hiroyukikaneko@nodal-boulder-264900.iam.gserviceaccount.com' ;
    
     // ビューID
    $view_id = '206296703' ;

    // 秘密キーファイルの読み込み
    $private_key = @file_get_contents( 'lib/googleapi/My Project 90468-18927f247fcc.json' ) ;
    putenv('GOOGLE_APPLICATION_CREDENTIALS=/home/appsvr/slavesystem.net/public_html/blog/wp-content/themes/xeory_base/lib/googleapi/My Project 90468-18927f247fcc.json');

    // クライアントを作成
    $client = new Google_Client();
    
    // スコープを定義
    $client->setScopes(array('https://www.googleapis.com/auth/analytics.readonly'));

    // クライアントにクライアントIDと秘密キーファイルを設定
    $client->setAuthConfig(array(
        'type' => 'service_account',
        'client_id' => $client_id,
        'private_key' => $private_key
    ));

    // アナリティクスのサービスを作成
    $analytics = new Google_Service_Analytics($client);

    // 結果用
    $results = '' ;

    //トータルPV数
    $result = $analytics->data_ga->get(
        'ga:' . $view_id ,
        '2019-11-01',
        'yesterday', 
        'ga:pageviews'
    );

    $results .= 'トータル:' . $result->rows[0][0] . '</br>';

    //昨日のPV数
    $result = $analytics->data_ga->get(
        'ga:' . $view_id,
        'yesterday',
        'yesterday',
        'ga:pageviews'
    );

    $results .= '昨日:' . $result->rows[0][0] . '</br>';

    //今日のPV数
    $result = $analytics->data_ga->get(
        'ga:' . $view_id,
        'today',
        'today', 
        'ga:pageviews'
    );

    $results .= '本日:' .  $result->rows[0][0];
 
    // ウィジェット内容の前に出力
    echo $args['before_widget'];
 
    // ウィジェットの内容出力
    echo '<h4 class="side-title"><span class="side-title-inner">'.$title.'</span></h4>';
 
    echo "<p>". $results . "</p>";
 
    // ウィジェット内容の後に出力
    echo $args['after_widget'];
    }
    
    public function form( $instance ) {
        $defaults = array(
            'title' => '',
        );
        $instance   = wp_parse_args( (array) $instance, $defaults );
        
        $title  = sanitize_text_field( $instance['title'] );
        ?>
        <p>
            <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label>
            <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" />
        </p>
        <?php
    }
    
    public function update( $new_instance, $old_instance ) {
        $instance = $old_instance;
        $instance['title']  = sanitize_text_field( $new_instance['title'] );
        return $instance;
    }
}
 
add_action(
    'widgets_init',
    function(){
        register_widget('counterWidget'); 
    }
);

ソースの解説とかは省略…。

ID丸出しですが、悪用しないようにお願いします…。

ウィジェットを追加する

最後に、WordPressのウィジェットに「アクセスカウンター」というウィジェットが追加されているはずなのでサイドバーに表示します。

表示結果はこんな感じです。

アクセス数少なすぎワロタwww

ワロタ…

懸念点とか

まあ今から心配することじゃないですが、仮に月間10万PVとかなった時にAnalyticsへのアクセス過多で怒られないかが心配です。


  • このエントリーをはてなブックマークに追加

SNSでもご購読できます。

コメントを残す


日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)