GTM是什麼?行銷人必懂的Google Tag Manager代碼管理工具教學(附超詳細11步安裝及追蹤步驟)

6 月 19, 2023 | Google搜尋行銷

GTM,google tag manager教學

GTM是什麼?為什麼行銷人都要掌握Google Tag Manager這個代碼管理工具?應該如何安裝GTM?如何通過GTM設定Google ads的轉換追蹤?超詳細的步驟,讓你輕鬆上手!

GTM是什麼?

設定追蹤碼

不論你使用Google Ads還是SEO,最終的目的都是希望客戶可以在你的網站上面發生轉換。而設定轉換追蹤就可以透過追蹤轉換數據來不斷調整和優化行銷策略。

通常追蹤碼會有兩組分別是:
Google 代碼(Global Site Tag),網站最基本的代碼。
事件代碼(Event Snippet),即是你自己定義的轉換動作,只要安裝了這個事件代碼,Google才會知道你所設定的轉換動作究竟是什麼。

你應該已經試過設定追蹤碼,感覺難度還可以接受,跟著步驟做就好了!
不過隨著行銷及分析工具越來越多,你可能就會陸續發現以下的問題:

  • 埋設的程序不簡單,每次埋設都要看著教學影片做,速度太慢了;
  • 工具越多,埋設的追蹤碼越多,已經搞不清楚每個追蹤碼的來源以及用途;
  • 因為埋設了太多的追蹤碼,導致網站的載入速度越來越慢,影響用戶體驗;
  • 數據太多,但是根本不知道數據應該怎麼看,有什麼意義,無法在同一的後台檢視;
  • 你可能遇到還不止這些,求助工程師,但也不知道從何說起……

究竟有沒有一些工具可以統一管理這些追蹤碼?一個平台可以統一修改、增減、檢視,重點是無需每次都要看著教學影片來埋設追蹤碼?

Google Tag Manager

GTM(Google Tag Manager),即是Google代碼管理工具,它是一套由Google推出而且免費的代碼管理系統,設定及部署Google的產品及第三方的代碼。
Google tag manager的作用

複雜的埋設追蹤碼程序只需要盡行一次,把GTM埋設在你的網站上面,你就可以透過GTM統一管理和整合網站上的追蹤碼,包括最常用的Google Ads、GA4、FB Pixel;而且你只要在GTM上簡單地選擇你希望的追蹤事件例如點擊、提交表單、加入購物車,都無需額外再埋設事件代碼了;你還可以透過GTM統一檢視追蹤數據。

GTM的優勢

GTM的好處

簡化代碼管理

這是GTM最大的優勢,如果你沒有使用GTM,你每次使用新的第三方工具,你都需要到網站後台埋設追蹤碼,每個追蹤的事件亦需要埋設時間代碼。先不說埋碼是否複雜,但至少聽上去每次這個詞已經感到恐懼。
透過GTM你只需要進行一次的埋碼便可解決所有追蹤碼設定,集中在GTM平台進行管理,即是沒有工程師的協助也能容易完成。

提升網站速度

網站的載入速度是影響搜尋用戶體驗的重要因素。當網站的後台埋設了大量的追蹤碼時,就會增加了網頁讀取的時間從而減慢了網站的載入速度。而GTM的集中管理就無需把代碼寫入Html中,不論你有多少個追蹤碼都不會影響載入速度。

減少埋碼的錯誤機率

我們都知道要檢查追蹤碼是否安裝成功需要等網站發佈後才能確認。而GTM則有提供預覽功能,我們就可以在網頁發佈前提前偵錯,及時修改。如果日後有發現新的錯誤,還是以選擇還原最初的版本。


GTM的運作原理

要理解GTM的運作原理,我們就需要理解以下這些組成要素:
GTM的結構

帳戶(Account)

是GTM中最高的層級,一個帳戶可以管理多個容器。一般來說,一家公司通常只需要一個帳戶就足夠了,而一個帳戶之下可以根據管理的網站數量來設定相對應的容器數量。這樣就可以同時追蹤這些網站的行銷成效。

容器(Container)

容器就是用來放置代碼的地方。可以把容器比喻成一個盒子,你可以把這個網站所有需要管理的代碼、觸發條件都放在這個盒子裡面,透過 GTM 管理這個容器。這樣就可以方便地添加、更新或刪除各種追蹤碼,而不必每次都修改網站的原始碼。

代碼(Tag)

「代碼」是指由分析、行銷和支援供應商提供的程式碼片段。簡單理解,就是用來記錄訪客在網站上的特定行為,而最常見的其中一個用途就是把這些信息回傳到第三方工具,用來分析行銷活動的成效。
通常代碼會有幾種類型:交易、事件、社交、計時、裝飾表單、裝飾連結及網頁瀏覽。

觸發條件(Trigger)

即是需要定義代碼被觸發的規則,可以把觸發條件理解成導火線,當訪客發生了指定的動作後,便會觸發條件,這個時候就會告訴系統什麼情況下開始收集資料並回傳給第三方分析工具。
這些觸發條件可以根據追蹤的目標類型分為:網頁瀏覽、點擊、表單提交、網頁捲動、網頁影片(如Youtube)或是自定義的觸發事件。
而觸發條件是由以下三個組件組成,要更好地理解,我們就假設我們這次追蹤的事件是:
表單提交。

變數(Variable)
● 這個是由我們自己定義觸發條件執行的規則,即是告訴代碼在這個時候開始收集數據並回傳。通常會分為內建變數(Bulit-in Variables),就系統預設的觸發方式;另外就是自訂變數(User-defines Variables),即是可以根據我們自己的需求特別定義。通常選擇內建變數已經就已經能夠滿足大部分的追蹤需求。
● 在表單提交的情境中,可能使用的變數是表單提交的頁面 URL 或特定的表單元素。
運算符號(Operateor)
● 這是定義變數與值之間的關係,可以讓系統判斷觸發條件是True或是False。常見的包括等於(equals)、包含(contains)及未包含(does`t contains)。
● 在表單提交的例子中,可能使用的運算符號是等於或包含。
值(Value)
● 定義變數的內容,如出現特定的數字、指定的網頁,就會觸發代碼收集數據。
● 在表單提交的情境下,可能的值是特定的表單提交頁面的 URL 或表單元素的識別符。

舉例來說,如果您希望當用戶在購物車頁面的 URL 包含 “Contact-form” 這個關鍵字時觸發條件,可以這樣設定:

  • 變數:{{form ID}}
  • 運算符號:等於(Equals)
  • 值:Contact-form

這樣當網站的表單 ID 等於 “contact-form” 時,觸發條件就會滿足,代碼就會被觸發。

如果想更好地理解本文的內容,可以觀看以下影片:


GTM教學(上):GTM安裝

了解GTM的運作原理後,我們馬上來安裝和使用GTM吧。基本上會分為兩大步驟:安裝GTM以及使用GTM追蹤事件。

1.帳戶設定

Google tag manager教學:GTM建立帳戶
我們可以登入代碼管理工具,然後建立帳戶。(你只需要有Gmail帳戶便可直接進入。)

2.容器設定

Google tag manager教學:容器設定
Google tag manager教學:勾選條款
在容器中我們需要輸入我們的網站,並選擇正確的類型。按建立之後便會進入條款的頁面,記得要勾選下面的同意。

3.GTM安裝到網頁中

Google tag manager教學:安裝GTM到網站
GTM只需要進行一次埋碼便可。視窗會跳出程式碼,需要分別貼到網站的<head>及<body>的部分。如果你的網站是使用Wordpress,不妨可以安裝外掛HFCM(Header footer code manager)協助。如果想了解wordpress如何安裝外掛,可以參考這個影片教學

4.確認安裝

Google tag manager教學:確認安裝
要檢查GTM的程式碼是否已經設定完成,我們就可以安裝外掛Google Tag Assistant來檢查在網站上是否已經安裝完成。

GTM教學(下):GTM事件追蹤 – Google Ads

在進行追蹤事件的時候,我們需要先弄清我們希望追蹤事件的邏輯。以Google Ads追蹤網站訪客提交表單為例,我們在設定之前及需要分析清楚整個事件的發生順序才能有效設置。

5.追蹤事件的邏輯順序分析

Google tag manager教學:事件的邏輯分析
以提交表單為例,當訪客在網頁上填寫表單並提交後,通常就會到達Thank You Page(感謝頁)。這個時候我們就可以把訪客瀏覽感謝頁作為觸發條件,這樣系統就會收集數據並回傳。清晰了事件後我們便可以進行後續步驟的設定了。

6.新增代碼

Google tag manager教學:新增代碼
我們可以直接在GTM界面選擇「代碼」的功能開始。進入代碼的功能,會有兩個需要我們設定包括是代碼設定及觸發條件。我們按照順序來設定即可。
關於命名方面,建議可以按照時間及平台的方式來命名,這樣可以方便日後從名字就能清楚知道轉換追蹤的類型及來源。

7.選在代碼類型

Google tag manager教學:新增代碼選擇追蹤工具
Google tag manager教學:選擇追蹤類型
新增代碼後,我們便需要選擇代碼類型。這次我們是以希望追蹤Google Ads廣告投放後提交表單的效果。我們在選擇代碼類型就選擇「Google Ads」,然後「Google Ads轉換追蹤」。

8.設定轉換ID及標籤

Google tag manager教學:設定轉換ID及標籤
當我們第一次設定的時候,先需要建立轉換連接器代碼。我們選擇「建立」然後進行清晰命名如Google Ads Linker,然後按「儲存」便可。
Google tag manager教學:設定轉換ID及標籤2
我們在Google Ads設定轉換追蹤的代碼設定的部分,我們就可以選擇「使用Google代碼管理工具」,找到相對應的「轉換ID」「轉換標籤」分別填寫到對應的地方。而下面的填寫選項主要是與Google Ads設定的轉換追蹤是一樣的。

9.新增觸發條件

Google tag manager教學:新增觸發條件
完成了代碼設定就可以進入觸發條件的設定。所以我們就可以把訪客填寫表單完成後到達的頁面Thank you page的瀏覽作為觸發條件。
進入新增觸發條件,進行命名為「Thank you page viewed」,然後選擇觸發條件類型「網頁瀏覽。
觸發條件的設定,選擇「部分的網頁瀏覽」,當中需要設定變數、條件及值。我們就可以選擇是當網址包含Thank you的字,便可觸發條件。

10.預覽

當代碼和觸發條件都設定完成後,我們便可以看到我們剛剛所設定的在GTM界面中顯示,這個時候我們就可以通過右上方的預覽來測試代碼是否成功安裝。
Google tag manager教學:預覽及提交

11.提交

測試後我們需要按「提交」,上述步驟所設定的代碼才算是完成。

總結

任何廣告都需要不斷追蹤數據,利用數據分析來不斷優化。而GTM就可以簡化代碼的繁瑣步驟,不妨多使用GTM這個工具,提升廣告的效果吧!

延伸閱讀:

【2024最新】SEO是什麼?SEO搜尋引擎優化自學入門10分鐘搞定

2024 Google廣告投放入門完整教學:詳解8大Google Ads類型(附投放及優化技巧)

8大類超過80款實用行銷軟體推薦,2024年行銷人必備行銷工具名單(附使用心得)

2024年IG入門必學功能:0到1的超簡單IG教學(含新功能特效框、註冊、Reels、限動、貼文、尺寸)

想知道您的網站健康程度嗎?請填寫以下表單,一分鐘立即領取網站健檢報告!

希望獲得搜尋引擎行銷的服務嗎?請立即聯繫萬智匯行銷顧問,我們將致力為您提供全面的Google Ads與SEO方案,秒速提升您的網站流量促成更多轉化!

致力於分享最新的行銷策略和數位世界的動態,希望能為您帶來有價值的內容和啟發。

想知道網站健康程度嗎?
Free領取SEO網站健檢報告,立即領取

為網站提供新的開始,全面健檢現在就開始!