Facebook for WordPress と Social Interaction Analytics

今回は Facebook と Google の Social Interaction Analytics の話です。 Facebook 関連シリーズ (1回目、2回目) も今回で一区切りです。

初期化コードとイベントリスナー

詳細は Social Interaction Analytics のページに書いてあるので簡単にすませますが、Facebook の「いいね！」ボタンが押されたのをトラックするには以下のようなコードでイベントリスナーを登録します。

FB.Event.subscribe('edge.create', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
});

先の記事に書いた通り、fb_xd_fragment の件もあって WordPress で「いいね！」ボタン等 Facebook の機能を使うのであれば、Facebook for WordPress プラグインがお勧めです。しかし、ここでの問題は上のコードをどこに置いたらよいかということです。 Facebook for WordPress を使用すると以下のようなコードがページに埋め込まれます。

<script type='text/javascript'>
/* <![CDATA[ */
window.fbAsyncInit=function(){FB.init({"channelUrl":"https:\/\/hetarena.com\/wp-content\/plugins\/facebook\/channel.php","status":true,"cookie":true,"xfbml":true,"appId":"my_app_id"});}
/* ]]> */
</script>
<div id="fb-root"></div><script type="text/javascript">(function(d){var js,id="facebook-jssdk",ref=d.getElementsByTagName("script")[0];if(d.getElementById(id)){return;}js=d.createElement("script");js.id=id;js.async=true;js.src="http:\/\/connect.facebook.net\/ja_JP\/all.js";ref.parentNode.insertBefore(js,ref);}(document));</script>

これは非同期のスクリプトファイル読み込み処理と初期化コードです。非同期のため、何も考えずに先のイベントリスナー登録コードを書いてしまうと FB という変数が未定義でエラーとなってしまいます。プラグインの出力する window.fbAsyncInit の関数の FB.init の後に先のイベントリスナー登録コードを埋め込むことができれば良いのですが、プラグインに手を加えたくないですね。どうすれば良いのでしょう？

facebook_jssdk_init_extras フィルター

実はちゃんと ‘facebook_jssdk_init_extras’ という名前でそれ用のフィルターが用意されています。ここにコールバックを登録しておけば目的の位置にコードを出力することができます。プラグインの readme.txt の中で以下のように説明されています。

* `facebook_jssdk_init_extras` – add extra JavaScript to the `fbAsyncInit` JavaScript function called after the Facebook JavaScript SDK is loaded

というわけで以下の様なコードを function.php に書いておけばオッケーです。

add_filter('facebook_jssdk_init_extras', 'my_facebook_init');

function my_facebook_init() {
  return
"
  FB.Event.subscribe('edge.create', function(targetUrl) {
    _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
  });
";

}

readme.txt やソースを読むといいことがあるよということで。

初期化コードとイベントリスナー

facebook_jssdk_init_extras フィルター

共有: