このページの本文へ

Facebookの「いいね!」で売上は増えるのか? (3/4)

2011年08月12日 12時00分更新

文●清水 誠

  • この記事をはてなブックマークに追加
本文印刷

Facebookの効果を計測する方法

 解析のゴールが明確になったので、実現するための計測・実装方法について検討します。いいね!ボタンのクリックとFacebookからの訪問をGoogle Analyticsで計測するため、以下のようなカスタマイズが必要です。

いいね!ボタンのタグ

 いいね!ボタンの実装には、iframe方式とXFBML方式の2種類があります。いいね!ボタンの設置方法については、公式サイトのLike Button - Facebook開発者を参照ください。以下のようにrefを追加するのが今回のポイントです。

iframe方式の場合:


<iframe src="...&ref=facebook-like"></iframe>

XFBML方式の場合:


<div id="fb-root"></div>
<script src="http://connect.facebook.net/ja_JP/all.js#appId=XXXXX&amp;xfbml=1"></script>
<fb:like … ref="facebook-like"></fb:like>
設定メモ
  • ref属性を追加すると、いいね!で共有されたページをFacebookから訪問する時にURLに2つのパラメーターが追加される(iframe方式とXFBML方式のどちらも同じ)
    例:/xxx.html?fb_ref=facebook-like&fb_source=profile_oneline
     fb_ref:refで指定した文字列がそのまま入る
     fb_source:Facebook上でのリンクの掲載場所(「'home」「profile」「search」「other」などの)ストリームタイプと「oneline」「multiline」などのストーリータイプを「_」でつないだ文字列)が入る

 さらに、Google Analyticsでいいね!のクリック数を計測するため、以下のスクリプトを追加します。


if (FB && FB.Event && FB.Event.subscribe) {
     FB.Event.subscribe('edge.create', function(targetUrl) {
       _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
     });
}
設定メモ
  • いいね!ボタンの後に記述する必要がある

Google Analyticsの計測タグ

 Facebookからのアクセス時に追加されるパラメーターをGoogle Analyticsの参照元(Source)と広告クリエイティブ(Ad Content)に入れるため、_trackPageviewよりも前のタイミングで以下のコードを実行します。


if (location.search && location.search.indexOf('fb_ref=') > -1) {
_gaq.push(
  ['_setCampSourceKey', 'fb_ref'],
  ['_setCampContentKey', 'fb_source']
);
if (document.cookie.indexOf(‘__utma=’)==-1)
  _gaq.push(['_setCustomVar', 1, 'facebook', location.pathname, 1]);
}
設定メモ
  • 通常のトラフィックソースはラストタッチで上書きされてしまうため、初回訪問時のみユーザースコープのカスタム変数に固定文字列「facebook」とURLの一部を入れておく
  • カスタム変数のスロット(2番目の引数)はサイトで未使用の番号に適宜変更が必要

この連載の記事

一覧へ
Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

Webディレクター江口明日香が行く