(巧克的GA分享) 如何將GA tracking code 放入Blogger中

       巧克任職於某知名品牌商的電子商務部門，拜工作所賜，經常需要查看GA(Google Analytics)報表。然而，公司家大業大，有世界級的Agency在幫我們進行GA的設定與操作，巧克的任務則是從報表中去尋找Insight及提供部門同仁最即時的資訊。由於覺得GA的功能很酷炫，因此，一直想試著自己埋埋看追蹤碼(GA tracking code)。但巧克不會寫網頁，因此，就拿抹茶的Blogger來試刀啦!!!(PS:其實是怕把公司的網頁弄壞，巧克就要流浪街頭了...)

      GA跟Blogger都是Google出品，相信在相容性上絕對OK!接著就請大家跟隨巧克的腳步來完成Tracking code的埋設囉!


       1. 請先註冊Google 帳號 (https://accounts.google.com/SignUp?hl=zh-TW)
           基本上，註冊完後，就能夠直接建立Blogger了!

Google 帳號註冊頁面

    2. 點擊連結並登入GA(http://www.google.com/intl/zh-TW/analytics/)

GA 主畫面

  3. 三個步驟(PS.不要懷疑，Google出品的東西，真的很簡單，以後會愛上。)

      看到最右側有大大"註冊"兩個字，大方地給他按下去!!!

第一次使用GA畫面

4. 開始一些簡單的註冊過程，主要就是第三個空格"網址"，要填入您主要網頁的網址唷。

   e.g. 抹茶與巧克的主要網址 http://matchachoco.blogspot.tw/

    都填完並同意Google的服務條款後，就在最下面藍框框點選"取得追蹤編號"

GA註冊畫面

5. 最後您會得到一組追蹤編號及一組追蹤程式碼。長的樣子如下:

    追蹤編號

    UA-6XX6XXXX-X

    追蹤程式碼

     <script>

  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-6XX6XXXX-X', 'auto');

  ga('send', 'pageview');

</script>

6.  打開自己的Blogger後台，在設定→其他→最下面有一個GA分析，
      在這邊貼上您的追蹤編號  e.g.UA-6XX6XXXX-X

7. 我們接著要去範本→編寫HTML找到HTML程式碼

於Blogger中找到HTML程式碼

8. 恐怖的HTML程式碼(誤...
    請大家先找到</head> (note:黃框部分，相信我，這麼複雜的程式碼中，只有一個地方有。)
    接著，從GA那邊把一坨追蹤程式碼給貼到</head>前面。
    最後，很重要的，請把<b:include name='google-analytics' data='blog'/> 
    這段程式碼刪掉。(note: 原本會位於下圖紅色框上面，<b:template-skin> 的下面)

    補充說明一下，原本在GA看到的「'」，在Blogger會自動轉換為「&#39;」，但大家不用去      更改，就依樣畫葫蘆的貼下去就好了!!!

HTML 程式碼中放入GA code

9. 最後，大功告成囉!請耐心等上約24小時，讓Google自己去進行相關的設定，之後，就可以
    看到流量跑來跑去囉!

抹茶與巧克的GA畫面

寫到這，巧克好累，之後巧克再慢慢分享要如何去觀察GA的流量囉!
謝謝大家的捧場。