CLOUDAD / PERSPECTIVES

行銷人員也能快速上手:5 分鐘學會用 Google Tag Manager 設定 Google Analytics 事件!

行銷人員也能快速上手:5 分鐘學會用 Google Tag Manager 設定 Google Analytics 事件!

內容摘要

5 分鐘學會用 Google Tag Manager 設定 Google Analytics 事件!

KEY POINTS

本文重點

  • GTM 的設定邏輯只有兩個元件:代碼(Tag)決定傳送哪些資料到哪個平台,觸發條件(Trigger)決定什麼時候傳送。
  • 設定前先分清楚「按鈕」是真正的按鈕還是連結:按鈕用「點擊」,連結用「連結點擊」。
  • 發佈前用 GTM 預覽模式和 GA4 DebugView 驗測,DebugView 可能延遲 10–15 秒才收到資料。
  • 發佈時填寫版本名稱與說明,方便之後做版本控管。

在數位行銷的世界中,數據追蹤及收集第一方數據是品牌不可或缺的一環。過往,在追蹤網站上的使用者行為時,常常會需要仰賴工程師來調整網站程式碼。如今,有了 Google Tag Manager(GTM)和 Google Analytics (GA4) 這兩個強大的工具,就算是沒有技術背景的行銷人員,也能輕鬆追蹤網站行為。

許多人剛開始接觸 GTM 時,會覺得設定事件複雜又難上手,也常常卡在不知道「是不是設定對了」。其實,只要掌握好設定邏輯,無論是追蹤網站上的按鈕點擊、表單提交或其他自訂事件的追蹤,都能輕鬆搞定。接下來,就一起學習如何用 GTM 簡單完成 GA4 的事件追蹤吧!

掌握這套邏輯,GTM 設定不卡關

開始設定之前,我們先理解 GTM 背後的核心追蹤原理。它的設定邏輯其實並不複雜,只要掌握以下這兩大元件,再根據追蹤的情境搭配使用,就能快速完成事件設定:

  • 代碼 (Tag):用來告訴 GTM 要做什麼事,例如傳送「哪些資料」到「哪個平台」
  • 觸發條件 (Trigger):決定「什麼時候」傳送資料
 
以實際情境來看,假設我們要追蹤網站上「聯絡我們」按鈕的點擊行為,並將資料傳送到 GA4,那兩大元件分別會是:
  • 代碼 (Tag) 傳送一筆「點擊事件」到「GA4」
  • 觸發條件 (Trigger)  在點擊「聯絡我們」按鈕時傳送資料
 
這些元件在 GTM 都有對應的設定區塊,只要先釐清「追蹤什麼行為」,再思考「什麼時機發生」,就可以套用這個邏輯來快速完成任何 GA 事件的追蹤設置。
 
觸發條件 (Trigger) → 在點擊「聯絡我們」按鈕時傳送資料(示意圖)
GTM 事件代碼設定畫面範例

GTM 設定步驟教學

現在就來實作看看,如何利用 GTM 設定「聯絡我們」按鈕點擊的行為,將事件資料準確送進 GA4!

0. 前置作業

在開始設定之前,請先完成以下前置作業:

完成後,我們可以點擊 Tag Assistant 擴充功能,只要有出現 GTM 的圖示及 ID,就表示已經安裝好了喔!
 
使用 Chrome 瀏覽器並安裝 Tag Assistant 擴充功能(示意圖)
💡 如果在帳戶建立、權限設定、或代碼部署過程中遇到任何困難,CloudAD 團隊也有提供 GA4 及 GTM 前期設定與顧問服務,歡迎與我們聯繫討論!

1. 新增及設定事件代碼

首先要告訴 GTM「要傳送哪些資料」以及「要傳送到哪裡」。以點擊「聯絡我們」按鈕為例,就是將此點擊事件的資料傳送到 GA4。

請點擊左側的「代碼」> 點擊「新增」

請點擊左側的「代碼」> 點擊「新增」(示意圖)

 

代碼設定區塊 > 選擇 Google Analytics >「Google Analytics (分析):GA4 事件」

代碼設定區塊 > 選擇 Google Analytics >「Google Analytics (分析):GA4 事件」(示意圖)

 

填入評估 ID 及 事件名稱 (這邊的事件名稱就是之後會出現在 GA4 中的事件名稱)

填入評估 ID 及 事件名稱 (這邊的事件名稱就是之後會出現在 GA4 中的事件名稱)(示意圖)

如果想更進一步了解這個行為的細節,也可以放上事件參數。例如,我們想知道使用者是點了哪個按鈕,就可以透過按鈕上的文字來區分,事件參數就可以設定:custom_text = 聯絡我們,或 custom_text = 免費諮詢 GA4 顧問。

參數值可以是固定的,也可以透過變數來截取使用者當下的互動資訊。

參數值可以是固定的,也可以透過變數來截取使用者當下的互動資訊。(示意圖)


2. 設定觸發條件

在設定觸發條件之前,要先留意有些「按鈕」表面上看起來像是按鈕元件,實際上可能只是經過樣式美化的「超連結」。如果是真正的按鈕點擊,觸發條件應選擇「點擊 Click」;如果是連結形式的按鈕,則要選擇「連結點擊 Link Click」作為觸發條件。

同樣以「聯絡我們」按鈕為例,實際上它是導向「聯絡我們」頁面的連結。如果要追蹤這個按鈕被點擊的次數,觸發條件就應該設定為「聯絡我們」連結被點擊時傳送資料給 GA4。

了解這個概念後,我們就可以開始設定對應的觸發條件了。


點擊「觸發條件」的區塊 > 右上方「+」新增觸發條件

點擊「觸發條件」的區塊 > 右上方「+」新增觸發條件(示意圖)

 

觸發條件類型選擇「點擊 – 僅連結」> 勾選「部分的連結點擊」> 條件設定「Click URL」等於「https://cloudad.tech/contact/」

(*觸發條件請依自己網站結構或是事件規劃來調整,條件放得越多,觸發時機越精準!)

 
(*觸發條件請依自己網站結構或是事件規劃來調整,條件放得越多,觸發時機越精準!)(示意圖)

 

代碼跟觸發條件都設定完成後,就可以點選右上角的「儲存」。 

代碼跟觸發條件都設定完成後,就可以點選右上角的「儲存」。(示意圖)

 

3. GTM 預覽模式驗測

設定完成後,千萬先別急著發佈!請務必先透過 GTM 預覽模式,搭配 GA4 的 DebugView 來驗測設定是否正確。

 

請在 GTM 點擊「預覽」

請在 GTM 點擊「預覽」(示意圖)

 

輸入網站網址 > 點擊「連結」進到預覽模式

輸入網站網址 > 點擊「連結」進到預覽模式(示意圖)

 

在預覽模式點擊「聯絡我們」按鈕

在預覽模式點擊「聯絡我們」按鈕(示意圖)

 

到 Tag Assistant 確認事件代碼是否有觸發

到 Tag Assistant 確認事件代碼是否有觸發(示意圖)

 

到 GA4 DebugView 確認是否有收到事件 (DebugView 可能會延遲 10 – 15 秒才會收到資料)

到 GA4 DebugView 確認是否有收到事件 (DebugView 可能會延遲 10 – 15 秒才會收到資料)(示意圖)

 

可以展開看傳送的參數、參數值是否正確

 

4. GTM 發佈

若設定驗測都沒問題,就可以準備上線了!

點擊右上方的藍色「提交」按鈕

點擊右上方的藍色「提交」按鈕(示意圖)

 

可以養成填寫版本名稱及版本說明,紀錄這次的更新有哪些,以利後續版本控管。

填寫完後點擊發布

填寫完後點擊發布(示意圖)

 

看到這個畫面就表示已經成功發布了喔!

看到這個畫面就表示已經成功發布了喔!(示意圖)

結論

數據追蹤不求人,行銷人員也能輕鬆上手!只要透過這篇教學,了解「代碼」與「觸發條件」的基本概念,就能自己動手用 GTM 完成事件追蹤設定。這套邏輯不只適用於按鈕點擊,像是電商建議事件、表單送出等,也都可以套用相同的概念進行設定,讓數據追蹤變得簡單又有彈性。

如果還不知道網站可以追蹤哪些事件,或是在 GTM 設定上卡關,CloudAD 數據團隊可以提供完整的事件追蹤規劃與技術支援。從事件定義、埋設驗證、到報表視覺化的呈現,我們能協助品牌打造有效的數據追蹤架構,歡迎與我們聯繫!

    姓名 Name* 電子郵件 Email* 公司名稱 Company Name* 想解決的問題 What would you like to solve?* 聯絡電話 Phone(選填 optional) 網站網址 Website(選填 optional) 想了解的服務(選填,可複選)Services you are interested in (optional) 怎麼知道我們(選填)How did you hear about us (optional)

    延伸閱讀

    KEEP READING

    接著讀,讓理解繼續累積