top of page

行銷新手入門!GTM (Google Tag Manager) 教學

已更新:1月2日



什麼是 GTM 為什麼要用 GTM

GTM ( Google Tag Manager ) 是 Google 提供的免費代碼管理工具,可以方便地追蹤各個事件,例如:某個按鈕、進入或離開某個頁面、滑鼠移動、提交表單…等。

當你建立了一個完美的官網,在做各類行銷增加曝光度之前,想確認官網是否有成功鎖定目標族群,這時你就需要認識 GTM !


解決三大常見問題:

  1. 看不懂程式碼,GTM 將程式碼轉化成容易操作的介面,讓大家都能輕鬆上手

  2. 簡化埋設追蹤碼的流程

  3. 若你有不同的官網,各自設置了追蹤碼,要各別管理十分不便利,這時就可透過GTM統一管理,使用同一個網站追蹤碼,大大提升管理效率!


本文亮點



ㄧ、開始安裝GTM

1. 建立 / 登入 Google 帳戶

GTM 的安裝編號必須從容器當中取得,所以必需先登入 Google 帳戶,接下來才能前往 Google Tag Manager 建立新的 GTM 帳戶與容器並取得容器的安裝編號


GTM 帳戶與容器皆提供完整的使用者權限管理功能,因此在創建 GTM 帳戶和容器後只需將權限開給相關人員,即可分享帳戶或容器的內容。

2. 建帳戶與容器

到達 GTM 後可以看到所有擁有權限的 GTM 帳戶 (預設為空白),點擊右上方「建立帳戶」即可創建新的 GTM 帳戶。


【建議】

將帳戶名稱設定為公司名稱,容器名稱設定為網站名稱,以方便日後的辨識。 創建新帳戶的同時,必須建立一個新的容器 (之後可以單獨建立新的容器在同帳戶底下) 帳戶名稱與容器名稱並不會影響後續使用。


容器的部分目前提供了網路、 iOS 、 Android 、AMP 四種容器種類,可以根據需求選擇相對應的類別。

每種容器會有各自不同的代碼可供使用,在創建之後不能修改容器類別。



3. 合約條款點選「是」。


4. 可在頁面右上角複製您的 ID。


5. 將剛剛複製的 ID 貼至 Showmore 後台,並點擊儲存,即設定完成 !

路徑:「擴充功能」-「追蹤代碼」-「Google Tag Manager」。



二、開啓預覽模式,檢查是否安裝成功

1. 在 GTM 後台點擊右上角「預覽」按鈕


2. 貼上您的官網網址

跳出Start Tag Assistant畫面,填入想要測試的網站,再檢查連接的網址是否正確,是否有勾選到 debug signal。


3. 連結成功畫面


進入預覽模式後,網站右下角顯示GTM已連接訊息。

GTM 預覽模式(debug mode)

透過GTM預覽模式可以檢查tag和trigger是否有正確啓動,即時找到錯誤並修正。



三、GTM 設定點擊事件(Click Event) 及變數

設定事件的組合有很多種,這邊會以特定商品為例子,來看看該如何妥善的應用它吧!


1. 查看想要設定的事件

以 Showmore 某特定 A 商品為例,在 GTM 後台點擊「預覽」進來後,選擇 A 商品的事件,複製事件名稱 "page_view"、以及對應 page 網址。


2. 設定觸發事件

左列「觸發條件」點擊新增後,新增事件名稱並編輯



我們在Variables中有看到此事件的分類為「自訂事件」,故選擇自訂事件。


選擇啟動時機:

  • 所有的自訂事件:所有會生成 "page_view" 事件的頁面都會被觸發。

  • 部分的自訂事件:若只想在瀏覽 A 商品頁時觸發事件,可透過在部分自訂事件中,指定 Page Path 為特定網址,當有顧客瀏覽此商品頁時,其事件將會被記錄。


3. 設定變數 (非必要)

若想要在事件中看到更多變數,則可在「變數」中選擇「設定」


勾選所有點擊。


「變數」中會出現你新增的變數



四、GA4連結GTM設定

1. 開啟您的Google Analytics > 資料串流


2. 複製評估ID



3. 設定「GA4代碼」

回到GTM後台,代碼設定 > 將代碼貼入





儲存後,再點「擊觸發條件」

選擇「All Pages」


點擊「儲存」即完成代碼設定。


4. 設定「GA4 事件」

重複剛剛的第三步驟,點擊「新增」後進入,選擇Google Analytics。




「觸發條件」一樣選擇「All Pages」


儲存後,您會看到兩種代碼,就完成囉!


5. 驗證GA是否有接收到設定的事件

走完這麼多流程後,要怎麼查看GA有成功接收到這些事件呢?

您可以先開啟Google Analytics 後台,來到 [DebugView]


再回到GTM後台預覽,在您的「預覽官網」點擊所設定的事件,同時間GA > Debugview,就會出現資料囉!


五、提交GTM

完成這些繁瑣的流程後,不要忘記最後一步!

請記得至GTM後台「提交」,您的官網代碼才會生效喔!


更詳細設定及安裝代碼管理工具可以參考:Google 代碼管理工具



※ 由於 GTM 代碼管理工具可埋設程式碼,為了資訊安全考量,請勿聽從陌生人指示操作 Google 代碼管理工具,並妥善保管您的帳號。





 

點擊下方【預約諮詢】,將有 Showmore 專人為您服務,協助您立刻開始電商之路!


Comments


bottom of page