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

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

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

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

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

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

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

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

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

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

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

またアクセスカウンターを表示するサービスを利用すると、 Analyticsと２重管理になり面倒くさいので 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さんのブログ等を参考にしながら進めました。

【最新！】Google Analytics APIの使い方！

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

次に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のウィジェットに「アクセスカウンター」というウィジェットが追加されているはずなのでサイドバーに表示します。

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

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

ワロタ…

懸念点とか

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

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

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