F.Ko-Jiの「一秒後は未来」

Google Analyticsでいいね!ボタンやTweetボタンのアクションを計測する方法

6月末にGoogle AnalyticsでGoogleの+1ボタン、FacebookのLikeボタン、TwitterのTweetボタンのアクションを計測できるようになりました。

» Google Analytics Blog: +1 reporting in Google Webmaster Tools and Google Analytics

このブログでも計測コードを設置してみたので、その方法を紹介しておきます。

Google Analyticsを新しい管理画面に切り替える

ソーシャルプラグインのレポートは新しい管理画面からしか確認できないので、Analyticsの管理画面を新バージョンに切り替えましょう。

analytics-social-1.jpg

新バージョンの管理画面では「Visitors」メニューの中に「Social」という項目があります。もしGoogleの+1ボタンをサイトに設置しているなら、すでに自動的に+1ボタンのアクションが計測されていると思います。

FacebookのLike/Unlikeを計測する

詳しい方法は「Social Interaction Analytics – Google Analytics – Google Code」にて解説されていますので、ここでは簡単に紹介しておきます。

まず「Like Button – Facebook開発者」からLikeボタンのプラグインコード(XFBML形式)を取得し、サイトに設置していることが前提です。

※ iframe形式では計測できませんでした。また、現在はXFBML形式のコードしか配布されていません。

Likeボタンを設置したら、以下のコードをサイトの</body>タグの直前に記述します。

<script type="text/javascript">
// like
FB.Event.subscribe('edge.create', function(targetUrl) {
    _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
});
// unlike
FB.Event.subscribe('edge.remove', function(targetUrl) {
    _gaq.push(['_trackSocial', 'facebook', 'unlike', targetUrl]);
});
// send
FB.Event.subscribe('message.send', function(targetUrl) {
    _gaq.push(['_trackSocial', 'facebook', 'send', targetUrl]);
});
</script>

Facebookについては以上です。この方法を使うとlikeだけでなく「unlike(いいね!の取り消し)」も計測できます。レポートを見てみるとやたらunlikeが多いページがあり、調べてみるとFacebookのエラーでLikeが元に戻っているページが1つ見つかったりしました。

TwitterのTweet Buttonを計測する

同様にツイッターのツイートボタンについても、アクションの計測ができます。コードの記述方法の詳細は先ほどと同じページに解説されています。

まずこちらもツイートボタンのコードをサイトに設置していることが前提です。まだの場合は「Twitter / Tweet Button」から取得してください。

次にAnalyticsの解説ページを参考に以下のコードを、</body>タグの直前に記述します。

<script type="text/javascript">
function extractParamFromUri(uri, paramName) {
    if (!uri) {
        return;
    }
    var uri = uri.split('#')[0];  // Remove anchor.
    var parts = uri.split('?');  // Check for query params.
    if (parts.length == 1) {
        return;
    }
    var query = decodeURI(parts[1]);

    // Find url param.
    paramName += '=';
    var params = query.split('&');
    for (var i = 0, param; param = params[i]; ++i) {
        if (param.indexOf(paramName) === 0) {
            return unescape(param.split('=')[1]);
        }
    }
}
twttr.events.bind('tweet', function(event) {
    if (event) {
        var targetUrl;
        if (event.target && event.target.nodeName == 'IFRAME') {
            targetUrl = extractParamFromUri(event.target.src, 'url');
        }
        _gaq.push(['_trackSocial', 'twitter', 'tweet', targetUrl]);
    }
});
</script>

Twitterについては以上です。ちなみにツイートボタンの場合、ただボタンを押されただけ(ツイートの送信はおこなわれていない)の場合には計測されないようになっています。

analytics-social-2.jpg

↑ うまく設置できれば、そのうちこのようにAnalyticsに集計されるようになります。

うまくいかない場合はJavaScriptのエラーが出ている可能性もありますので、Firefoxの場合は拡張機能のFirebugで「コンソール」を、Chromeの場合は画面を右クリックして「要素の検証」から「Console」を見て、エラーが出ていないか確認してみましょう。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

著者について

fkoji

F.Ko-Ji

Webエンジニアやってます。最近は ドットインストール の開発がお仕事です。その傍ら、個人で Meity電車遅延なう梅酒.in#グラドル自画撮り部 の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。

» 詳しいプロフィールや運営サービスの一覧など