日報 #52 - GAでSNSボタンのイベントとか

仕事後フットサルやってました。
1ヶ月ぶりくらいだから、まぁ体はまだ覚えてるだろうと思っていました。
オッサンとしての自覚が足りてませんね。
膝ガックガクです。

ところで、最近の僕の反省点として「定量的にちゃんと物事を見積もって判断する」というものがあります。
真剣に麻雀やれば一発で鍛えられる素質なんですが、
僕には結構欠けてる要素です。
ついつい感情的に、なんとなく、気持ちのいいほうにいっちゃったりしちゃうんですね。
今日のフットサルでも気付きがありました。
サッカー未経験の僕は、プレイ全般に渡って不慣れなんですが、
取り分け「ポジションどり」のやり方がどうにも苦手です。
フィールドを見渡して何となく空いてる場所にボンヤリと佇んじゃったり。
パスを貰ってから状況判断をして次の行動をするので、結構すぐ囲まれちゃったりします。
「考えてない」行動の典型だなと帰り道思いました。
ですが、複雑なことはわからないし、思うように体も動かないので、
とりあえず次回以降は「パスを受け取った次の行動だけ決めてポジションを取る」ということにしました。
そして差し当たって何も考えず、パスを貰った次の行動は、必ず決めた通りに動くことにしました。
どう変化するか楽しみです。

さて、関係ない話が長引いたので今日は手短に。

SNSボタン（ツイートボタンとか、FBLikeボタンとか）のクリックイベントをGAでとるのって意外と面倒だったりします。
単純にボタンのdiv要素にonclick作ってもiframeだと無反応だったりします。
当たり前ですね。
もちろん$('iframe').onclickとか$('iframe').on('click')とかしてコールバック受けようとしても無駄無駄無駄無駄です。

なので色々Devリファレンスを調べていたら、ありました。
FBやTWのreadyみたいなイベントや、
アクションが行われたイベントをキャッチする方法が。

まずFB。

// いつものようにFB読み込み
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

// ロードが終了した後イベントをバインド
window.fbAsyncInit = function() {
    FB.Event.subscribe("edge.create",
    function(response){
       _gaq.push(['_trackEvent', 'hoge_cat', 'hoge_act', 'hoge_lab']);
    });
};

簡単ですね。
その他リファレンスは
https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/v2.1
ここ参照次TW。

// twitter読み込み
window.twttr = (function (d, s, id) {
  var t, js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src= "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);
  return window.twttr || (t = { _e: [], ready: function (f) { t._e.push(f) } });
}(document, "script", "twitter-wjs"));

//Twitterの読み込み終了コールバックとバインド
twttr.ready(function (twttr) {
twttr.events.bind("click", function(event,a){
    _gaq.push(['_trackEvent', 'hoge_cat', 'hoge_act', 'hoge_lab']);
  });
});

TWの開発者サイトがリニューアルしててかなり戸惑いましたが、
リファレンスは
https://dev.twitter.com/web/javascript/events
ここ参照。
ではでは、足も痛いし眠いのでこのへんで。

俺の報告

RoomClipを運営するエンジニアの日報（多分）です。

日報 #52 - GAでSNSボタンのイベントとか