Blogger 網站如何追蹤 Google Analytics 點擊事件的成效？

2023.3.27 公告：從 2023.7.1開始舊版 GA 將失效，請改用 GA4 並閱讀這篇「GA4 如何追蹤自訂事件的成效及建立報表」。

之前接到一個需求，想在 Blogger 網站監測連結點擊的成效，收集不同優惠方案的點擊數據。

只要網站有安裝 Google Analytics(簡稱 GA)，那麼做到這件事很容易，為每個點擊按鈕植入 GA 追蹤碼，在 GA 後台就能撈出點擊事件的詳細報表。

但實際上做了之後才發現 Blogger 網站會遇到一些狀況，請見本篇的說明。

一、植入 GA 追蹤碼

1. 官方說明

• GA 事件跟踪

參閱 GA 官方文件後，追蹤碼的完整格式如下：

ga('send', 'event', [事件類別], [事件動作], [事件標籤], [事件價值]);

• 前兩個 send、event 都是必要參數
• 事件類別：必要參數，為該事件設定一個分類字串
• 事件動作：必要參數，紀錄該事件的執行動作
• 事件標籤：非必要參數，可為該事件進行註解說明
• 事件價值：非必要參數，只能填入數字

2. 追蹤碼範例

假設網頁上有個按鈕，會連結到行銷網頁，為了追蹤點擊的成效，追蹤碼範例如下：

ga('send', 'event', '按鈕', '點擊', '2019 最新優惠', 1000);
只要這個按鈕被點擊了，這一行 JS 就會被執行，該點擊事件會自動出現在 GA 的報表。


3. 完整 HTML 碼範例

這個按鈕的超連結語法範例如下：

<a onclick="ga('send', 'event', 'button', 'click', '2019 最新優惠', 1000);" href="行銷網頁連結" target="_blank">前往最新優惠頁面</a>
有沒有覺得奇怪上面完整的範例碼，把 '按鈕', '點擊' 這兩組中文字串，換成了英文？

我在這篇「Google analytics 事件追蹤教學」，看到作者使用的參數為中文，而且 GA 截圖也顯示中文，但很奇怪「事件類別」、「事件動作」這兩組參數，我使用中文字串時 GA 都不吃，但一用英文字串 GA 馬上就撈到數據。

所以讀者可以自行試試看，如果中文也無法被 GA 接受的話，就使用英文吧。

但「事件標籤」確定是可以使用中文字串的。

二、調閱 GA 事件報表

接著進入「GA 官網」→ 左側選單：

• 行為 → 事件 → 總覽

• 如果剛剛自行點擊按鈕，想要馬上看報表，右上角記得日期範圍要選「今天」。
• 可以看到「事件類別」抓到的資料全部都是英文，我設成中文字串的事件全部都沒撈到。

切換到「活動標籤」看看，這邊就正常了，中、英文都沒問題。

三、Blogger 如何植入事件追蹤碼

前面說明的是所有網站通用的處理狀況，Blogger 若使用相同的追蹤碼，有可能在 GA 怎麼樣都追蹤不到任何事件。

調查了很久才發現原因，可參考這篇「Google Blogger/Blogspot onclick event in link will not pass to Google Analytics」。


1. Blogger 預設的 GA 安裝碼

事情出在 Blogger 範本中的 GA 預設程式，大部分 Blogger 站長都會符合以下兩個條件：

• 後台 → 設定 → 其他 → Analytics (分析) 網站資源 ID → 填入 GA ID
• 範本中應該會看到這行字串 <b:include data='blog' name='google-analytics'/>

這樣 Blogger 不需要額外在範本中放入 GA 安裝碼，在網頁原始碼中就會看到自動產生的 GA 安裝碼，像下圖這樣：




注意上圖紅框的程式碼，這行由 Blogger 自動產生的參數，正是讓 GA 事件追蹤碼失效的原因：

ga('blogger.send', 'pageview');

正常的 GA 安裝碼參數應該是 'send' 而不是 'blogger.send'，這會導致 「GA 事件追蹤碼」跟「GA 安裝碼」彼此無法對應。

然而 Blogger 自動產生的「GA 安裝碼」我們又無法修改，所以我們得修改「GA 事件追蹤碼」的參數，讓兩邊能對應的起來。


2. Blogger 修改事件追蹤碼

請將前面提供的完整 HTML 碼範例，改成以下即可：

<a onclick="ga('blogger.send', 'event', 'button', 'click', '2019 最新優惠', 1000);" href="行銷網頁連結" target="_blank">前往最新優惠頁面</a>
只有紅字部分不同，其他都一樣，這樣 GA 報表就能看到事件的數據了。

四、總結

使用 Blogger 先檢查一下，如果使用官方範本，那麼一定會出現自動產生的 "blogger.send" 參數，那麼就需要修改 GA 事件追蹤碼。

如果使用非官方範本，那麼可開啟網頁原始碼，搜尋是否有 "blogger.send" 參數。如果沒有的話，應該當初是自行安裝 GA，那麼追蹤 GA 事件就不必特別修改參數了。

更多 Google Analytics 相關文章：