Google Analytics 事件教學 - 以Youtube為例

GA提供了一個事件的功能，能讓你從中看到我的文件被下載了幾次，
影片被看了幾次，E-Mail寄送了幾次，甚至是按鈕被按下了幾次都可以記錄起來，
其中看到最好玩的大概就是Youtube的部分，除了可以看到被撥放了幾次以外，
還可以看到撥完了幾次，這功能實在是太好玩了！

這功能要用，主要有兩個部分要看：

1.Youtube APIs : https://developers.google.com/youtube/iframe_api_reference
2.GA 追蹤代碼 For Javascript : https://support.google.com/analytics/answer/1008083

當中要用這樣的追蹤，要先將本來從.js追蹤資訊->追蹤程式碼中得到的程式碼替換成以下程式碼，才可以使用_gaq.push喔：

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

然後再從Youtube Player API中看到有以下的Event可以抓取：

• YT.PlayerState.ENDED
• YT.PlayerState.PLAYING
• YT.PlayerState.PAUSED
• YT.PlayerState.BUFFERING
• YT.PlayerState.CUED

當使用者改變了Youtube Player的狀態時，可以從Event中抓取這幾個狀態，
這時，我就可以從中設定GA的追蹤event，比如說按下撥放以後我要記錄到GA，
那麼代碼就會像下面這樣：

• if(event.data ==YT.PlayerState.PLAYING){
    _gaq.push(['_trackEvent', 'Videos', '開始播放',player.getVideoUrl()]);
}

如此一來，只要按下撥放以後，我就可以從事件中看到我的影片被撥放了：

順便解釋一下，撥放完畢的定義是使用者看完影片，Event是ENDED。

附上這次教學的範例檔案：按我下載



本文參考：溫厝的543 - 網路行銷數據化 利用 網站分析 Google Analytics 來為 Email連結mailto做個目標設定吧 trackPageview基礎教學