GTM 是什麼?一次掌握代碼管理工具與 GA4 追蹤設定

GTM 是什麼?快速掌握 GTM 代碼的用途

GTM 是什麼?Google Tag Manager,簡稱 GTM,是 Google 提供的免費代碼管理系統。網站只要先安裝一組 GTM 容器程式碼,後續便能透過管理介面新增、修改與停用 GA4、Google Ads 轉換追蹤、再行銷代碼及部分第三方工具,不必每次都直接修改網站原始碼。

GTM 代碼本身不等於分析報表,也不會在安裝後自動追蹤所有使用者行為。它的主要工作是根據設定好的條件載入追蹤代碼,再將資料傳送給 GA4、Google Ads 或其他分析與廣告平台。若要記錄按鈕點擊、表單送出、影片播放或商品購買,仍須正確設定代碼、觸發條件與變數。

對行銷人員而言,GTM 代碼管理工具可以集中管理網站中的行銷與分析標記;對開發人員而言,則可減少反覆部署簡單追蹤碼的工作。不過,涉及網站資料層、會員資訊、付款流程或複雜電子商務事件時,通常仍需要工程人員協助。

Google 代碼管理工具的三 個核心元件

代碼

代碼又稱標記或 Tag,代表 GTM 需要執行的工作。例如,傳送 GA4 事件、記錄 Google Ads 轉換,或載入經過審核的第三方 JavaScript 程式碼。

建立代碼不代表它會立即運作,還必須指定觸發條件。若只建立 GA4 事件代碼,卻沒有設定何時啟動,GTM 便不會將事件資料送出。

觸發條件

觸發條件用來決定代碼何時執行,常見類型包括所有網頁、頁面瀏覽、連結點擊、元素點擊、表單送出、自訂事件、計時器與捲動深度。

例如,希望使用者按下聯絡按鈕時傳送 GA4 事件,可建立點擊觸發條件,再依按鈕 ID、CSS 選取器或連結網址限制啟動範圍。設定時應避免只用容易改變的按鈕文字判斷,以降低網站改版後失效的風險。

變數

變數用來保存或取得動態資訊,例如頁面網址、點擊文字、點擊網址、元素 ID、GA4 評估 ID 或資料層中的交易金額。

GTM 內建多種變數,也允許建立自訂變數。妥善使用變數能減少重複設定,例如將 GA4 評估 ID 集中管理,便不需要在每一個事件代碼中重複輸入。

GTM、Google 代碼與 GA4 有何不同

Google 代碼、GTM 與 GA4 經常被混為一談,但三者角色不同。Google 代碼通常指可直接安裝在網站上的 Google tag;GTM 是集中管理標記的工具;GA4 則是接收、處理及呈現網站或應用程式資料的分析平台。

工具功能比較表

項目 Google 代碼 Google Tag Manager GA4
主要功能 將 Google 產品代碼安裝至網站 管理及載入多種追蹤代碼 蒐集、處理與分析事件資料
常見識別碼 GT-、G-、AW- GTM- G-
是否提供分析報表
是否可管理第三方代碼 通常不以此為主要用途 可以,但須注意安全與相容性
是否需要設定事件 視產品需求而定 是,需搭配代碼與觸發條件 是,可接收自動、建議及自訂事件
適合情境 僅需部署 Google 產品 同時管理多項分析及廣告工具 查看流量、事件、轉換與使用者行為

若網站只需使用單一 Google 產品,可依官方操作說明直接安裝 Google 代碼。若需要同時管理 GA4、Google Ads 及其他第三方標記,使用 Google 代碼管理工具通常較有彈性。

Google Tag Manager 登入與帳戶建立流程

進入官方網站並登入

進行 Google Tag Manager 登入時,應直接前往官方網址:https://tagmanager.google.com,並使用具有管理權限的 Google 帳戶登入。操作前要確認網址網域為 google.com,避免在不明網站輸入帳號密碼。

登入後,按下「建立帳戶」,依序填寫帳戶名稱、國家或地區、容器名稱及目標平台。一般公司可將帳戶名稱設為公司或品牌名稱,容器名稱則使用正式網站網域,方便團隊辨識。

建立 GTM 帳戶與容器

完整建立流程如下:

  1. 前往 Google Tag Manager 官方網站。
  2. 登入 Google 帳戶。
  3. 選擇「建立帳戶」。
  4. 輸入公司或組織名稱。
  5. 設定容器名稱,網站通常可填入主要網域。
  6. 目標平台選擇「網路」。
  7. 按下「建立」並閱讀服務條款。
  8. 接受條款後取得 GTM 容器安裝程式碼。

帳戶與容器並不相同。帳戶代表公司或組織,容器則對應實際部署環境。若企業同時擁有官方網站、活動網站與行動應用程式,應依管理需求規劃不同容器,避免所有設定混在一起。

在網站上設定 Google 代碼與 GTM 容器

取得網站專屬安裝程式碼

建立網頁容器後,系統會顯示兩 段專屬程式碼,並包含「GTM-XXXXXXX」形式的容器 ID。第一段 JavaScript 應依官方指示放在每個頁面的<head>區域中,位置盡量接近開頭;第二段<noscript>程式碼則放在<body>標籤開頭之後。

每個容器的 ID 不同,不建議從其他網站複製範例程式碼後直接使用。正確做法是登入自己的 GTM 帳戶,開啟目標容器,再從「管理」或安裝 Google 代碼管理工具的選項取得完整內容。

不同網站系統的安裝方式

自行開發的網站可由工程人員將兩段程式碼放入共用版型,確保所有頁面都會載入。WordPress 等內容管理系統可修改佈景主題或使用可信賴的整合方式,但應避免同時透過外掛與原始碼重複安裝。

Shopify 或其他開店平台的可用安裝方式,會受到平台方案、結帳頁面權限及系統更新影響。操作前應以該平台當下的官方文件為準,不能假設所有頁面都能任意加入自訂 JavaScript。

檢查是否重複安裝

在網站上設定 Google 代碼時,常見問題是同時保留原本的 GA4 程式碼,又透過 GTM 部署相同設定,導致頁面瀏覽或事件重複計算。

安裝完成後,應檢查網站原始碼、GTM 預覽模式、瀏覽器開發者工具及 GA4 即時報表。若同一個事件在一 次操作中送出兩次,需確認是否存在重複容器、重複觸發條件或其他外掛再次載入代碼。

GTM 設定與 GA4 安裝步驟

取得 GA4 評估 ID

進入 Google Analytics 後,開啟目標 GA4 資源,在管理區域選擇「資料串流」及對應的網站串流,即可查看以「G-」開頭的評估 ID。介面名稱可能隨 Google 產品更新而調整,應以帳戶中實際顯示內容為準。

評估 ID 與 GTM 容器 ID 用途不同。GTM 容器 ID 通常以「GTM-」開頭,GA4 網頁資料串流評估 ID 則以「G-」開頭,不可互相替代。

建立 Google 代碼

在 GTM 工作區選擇「代碼」並新增代碼,選取 Google 代碼類型,填入對應的 Google 代碼 ID 或 GA4 評估 ID,再將觸發條件設為適合的全站載入條件。

設定名稱應清楚描述平台、用途及觸發範圍,例如「GA4-Google 代碼-全站」,避免使用「新代碼」或「測試」等難以維護的名稱。

建立 GA4 事件

若要記錄特定行為,可新增 GA4 事件代碼,設定事件名稱及必要參數,並搭配點擊、表單或自訂事件觸發條件。

GA4 事件名稱建議優先參考 Google 官方建議事件。若沒有適用的建議事件,再使用格式一致的自訂名稱。事件命名應避免空格、中文與大小寫混用,並在團隊內建立事件規格文件。

GTM 代碼設定的實際操作邏輯

以按鈕點擊追蹤為例

以下為一般性的設定邏輯,不代表所有網站都能直接套用:

  1. 在 GTM 啟用點擊相關內建變數。
  2. 使用預覽模式進入網站。
  3. 點擊目標按鈕,查看 Click ID、Click Classes、Click URL 等資訊。
  4. 建立僅限連結或所有元素的點擊觸發條件。
  5. 使用穩定且可辨識的條件限制目標按鈕。
  6. 建立 GA4 事件代碼並輸入事件名稱。
  7. 將點擊觸發條件連結至事件代碼。
  8. 在預覽模式測試是否只啟動一 次。
  9. 前往 GA4 DebugView 或即時報表確認資料。
  10. 確認無誤後提交版本並發布。

這類 GTM 代碼設定不應只確認「代碼有啟動」,還要檢查啟動時機、次數與參數內容。若按鈕尚未真正完成送出,事件就先被記錄,可能會高估有效表單或轉換數量。

表單追蹤的注意事項

GTM 內建的表單送出觸發條件不一定適用所有網站。部分表單透過 AJAX 或前端框架傳送,提交時不會產生傳統瀏覽器表單事件。

較可靠的方法是由網站在表單成功後將自訂事件推送至 dataLayer,再由 GTM 接收。如此可區分點擊送出按鈕、驗證失敗與真正提交成功,資料品質通常優於單純追蹤按鈕點擊。

dataLayer 資料層的作用

dataLayer 是網站與 GTM 之間的結構化資料傳遞機制。網站可在特定行為完成後推送事件名稱、商品編號、交易金額、幣別或會員狀態,再由 GTM 變數讀取並傳送至分析平台。

電子商務追蹤尤其仰賴一致的資料層規格。GA4 建議電子商務事件包含特定事件名稱與參數結構,例如查看商品、加入購物車、開始結帳及購買。若資料格式錯誤,即使 GTM 代碼成功啟動,GA4 報表仍可能無法正確呈現商品與收益資料。

資料層不應放入電子郵件、電話、身分證字號或其他可識別個人的敏感資料,也不應未經評估就將網站內部資訊傳送至分析或廣告平台。

GTM 預覽、測試與發布

使用預覽模式

完成 GTM 設定後,先按下「預覽」,輸入要測試的網站網址,透過 Tag Assistant 連線。操作目標行為後,檢查事件時間軸、已啟動代碼、未啟動代碼、觸發條件及變數值。

如果預覽模式無法連線,可檢查 GTM 容器是否正確安裝、網站是否阻擋第三方 Cookie、瀏覽器擴充功能是否攔截追蹤請求,以及內容安全政策是否限制相關網域。

建立版本並發布

預覽成功不等於設定已正式上線。只有按下「提交」、輸入版本名稱與說明,並完成發布後,修改內容才會套用到正式網站。

版本名稱應說明修改目的,例如「新增聯絡表單成功事件」,版本說明則記錄事件名稱、觸發頁面及測試結果。GTM 保留版本紀錄,發生問題時可檢查差異或還原先前版本。

GTM 權限、安全與隱私管理

GTM 能載入 JavaScript,因此帳戶權限應視為網站安全管理的一部分。管理者應採取最小權限原則,只讓必要人員擁有發布權限,離職或專案結束後立即移除帳戶,並為 Google 帳戶啟用兩步驟驗證。

第三方自訂 HTML 代碼在發布前應經過審查,確認來源、資料傳送目的、效能影響及停用方式。不要因為 GTM 可以免改網站程式碼,就跳過資訊安全與法務程序。

若網站服務台灣或其他受隱私法規規範的使用者,應依資料蒐集目的、Cookie 類型及適用法規提供必要告知與選擇。Google 的同意聲明模式可協助代碼依同意狀態調整行為,但不能取代網站的隱私政策、Cookie 管理與法律評估。

常見 GTM 設定錯誤

把 GTM 當成分析工具

GTM 不會提供完整流量與轉換報表。資料需要傳送至 GA4、Google Ads 或其他平台,才能進一步分析。

未測試就直接發布

錯誤的觸發條件可能造成事件漏記或重複記錄。每次修改都應先預覽,再於接收資料的平台驗證。

所有代碼都設為全站觸發

不是每個代碼都應在所有頁面載入。過多第三方 JavaScript 可能增加頁面負擔,也可能在沒有適當同意或必要情境下蒐集資料。

使用不穩定的點擊條件

按鈕文字、CSS 類別與頁面結構可能因改版而改變。重要事件宜使用穩定的元素屬性或由工程端推送 dataLayer 自訂事件。

缺乏命名與版本規範

容器內代碼愈多,維護難度愈高。建議統一使用「平台-類型-用途-範圍」命名,並在每次發布時留下可追查的版本說明。

結論

GTM 是集中部署與管理網站追蹤代碼的工具。正確的 GTM 教學不只是把容器程式碼貼到網站,還應包含帳戶權限、代碼、觸發條件、變數、dataLayer、預覽測試、版本發布及隱私管理。

完成基礎安裝後,應先從 GA4 全站設定及少量重要事件開始,確認資料準確再逐步擴充。GTM 雖能減少直接修改網站原始碼的次數,但複雜電子商務、會員流程與敏感資料管理仍需要行銷、分析、工程及法務共同確認。

常見問題

1. GTM 是免費的嗎?

Google Tag Manager 標準版本可免費使用。Google 另有適用於特定企業需求的相關方案,實際功能與資格應以 Google 官方資訊為準。

2. 安裝 GTM 後會自動追蹤所有點擊嗎?

不會。GTM 可監聽部分互動,但仍須建立代碼、觸發條件與變數,並將資料傳送至 GA4 等平台。

3. GTM 容器 ID 與 GA4 評估 ID 有何不同?

GTM 容器 ID 通常以「GTM-」開頭,用於載入 GTM 容器;GA4 評估 ID 通常以「G-」開頭,用於識別 GA4 網頁資料串流。

4. Google 代碼與 GTM 可以同時安裝嗎?

可以,但必須避免透過不同方式重複送出相同事件。若直接安裝 Google 代碼,又透過 GTM 部署同一項設定,可能造成資料重複。

5. 不懂程式碼也能完成 GTM 設定嗎?

基礎頁面瀏覽與簡單點擊追蹤通常可透過介面完成,但 dataLayer、電子商務、AJAX 表單與跨網域追蹤可能需要開發人員協助。

6. 為什麼 GTM 預覽成功,GA4 卻沒有資料?

可能原因包括評估 ID 錯誤、事件參數設定不正確、同意狀態限制、瀏覽器攔截,或 GA4 介面尚未處理資料。可先使用 DebugView 與瀏覽器開發者工具檢查。

7. 修改 GTM 後為什麼正式網站沒有變化?

預覽只用於測試。必須在 GTM 按下「提交」並發布新版本,設定才會套用至正式網站。

8. GTM 可以安裝 FB Pixel 嗎?

可透過平台支援的範本或經審核的自訂 HTML 方式安裝 Meta Pixel,但須確認代碼來源、觸發條件、使用者同意與資料傳送規範。

9. GTM 會影響網站速度嗎?

GTM 容器本身的影響通常有限,但透過容器載入大量第三方代碼可能增加網路請求與 JavaScript 執行時間。應定期移除未使用代碼並限制不必要的全站載入。

10. 如何確認 GTM 代碼安裝正確?

可使用 GTM 預覽模式、Tag Assistant、瀏覽器開發者工具及 GA4 DebugView 交叉檢查。除了確認容器存在,也要驗證事件是否在正確時間啟動一 次,並送出正確參數。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料