GTM（Google Tag Manager，代碼管理工具） 是一個免費的「代碼中控台」。安裝一次容器後，所有第三方追蹤碼（GA4、Meta 像素、Google Ads 轉換⋯）都能在 GTM 後台用點選的方式新增、修改、發布，不必再每次都請工程師改網站原始碼。
這篇 GTM 教學 會帶新手從零理解 GTM 的四大元素，並實際安裝容器、發布第一個 GA4 代碼。學會它，後面安裝任何追蹤都會快很多。
GTM 四大元素：先把詞彙搞懂
| 元素 | 角色 | 白話解釋 |
|---|---|---|
| 容器（Container） | 裝所有代碼的盒子 | 一個網站放一個，安裝一段碼即可 |
| 代碼（Tag） | 要執行的追蹤 | 例如 GA4、Meta 像素那段程式 |
| 觸發條件（Trigger） | 何時執行代碼 | 例如「所有頁面」或「點擊預約鈕」 |
| 變數（Variable） | 提供資料 | 例如點擊文字、頁面網址、購買金額 |
當「觸發條件」成立時，GTM 就執行「代碼」，過程中用「變數」取得需要的資料。 四者組合，就能完成各種追蹤。
步驟一：建立 GTM 帳戶與容器
- 1
登入 GTM
前往 Google Tag Manager，用 Google 帳號登入，點「建立帳戶」。
- 2
填寫帳戶與容器資訊
輸入帳戶名稱（公司名）、國家選「台灣」；容器名稱建議用網域名，目標平台選「網路（Web）」。
- 3
取得容器 ID
建立後會得到一組容器 ID
GTM-XXXXXXX，並彈出安裝程式碼視窗。
步驟二：把容器代碼安裝到網站
GTM 容器需要安裝 兩段 程式碼，位置不同，缺一不可。
- 1
第一段放 head
把第一段
<script>程式碼貼到 全站 `<head>` 的最上方，越早載入越好。 - 2
第二段放 body 開頭
把第二段
<noscript>程式碼貼到 `<body>` 開始標籤之後，用於停用 JavaScript 的瀏覽器。 - 3
用 CMS 外掛安裝（替代）
WordPress、Shopify 等可用官方外掛或主題設定填入
GTM-XXXXXXX，省去手動貼碼。
GA4 的 G- 開頭評估 ID 與 GTM 的 GTM- 容器 ID 是兩回事。GTM 是「裝代碼的容器」，GA4 是「裝在容器裡的其中一個代碼」，別貼錯地方。
步驟三：發布第一個代碼（以 GA4 為例）
- 1
新增 Google 代碼
在 GTM 後台點「新增代碼」，代碼類型選「Google 代碼」，填入 GA4 的評估 ID
G-XXXXXXXXXX。 - 2
設定觸發條件
觸發條件選「Initialization - All Pages」（初始化 - 所有頁面），確保每頁都載入 GA4。
- 3
儲存並命名
把代碼命名為好辨識的名稱，例如
GA4 - 設定，然後儲存。
步驟四：用預覽模式驗證
- 1
進入預覽
點右上角「預覽」，輸入網址後會開啟一個帶 Tag Assistant 的新分頁，連到你的網站。
- 2
確認代碼有觸發
在 Tag Assistant 視窗左側操作網站，右側會顯示哪些代碼「Tags Fired（已觸發）」。確認 GA4 代碼在 Tags Fired 區。
- 3
搭配 GA4 即時報表
同時看 GA4 即時報表是否出現活躍使用者，雙重確認資料真的有送出。
在預覽模式測好後，一定要回 GTM 點右上角「提交（Submit）」並建立版本，變更才會真正對所有訪客生效。只儲存代碼是不會上線的。
GTM 帶來的好處
- 不必反覆動原始碼：新增追蹤在後台點選即可，降低對工程資源的依賴。
- 版本控管：每次提交都建立版本，出錯可一鍵還原。
- 集中管理：GA4、Meta 像素、Google Ads 轉換全集中一處，好維護。
- 彈性觸發：可監聽點擊、表單、捲動、自訂 dataLayer，追蹤細緻動作。
常見問題
GTM 要收費嗎？
標準版 GTM 完全免費，對中小型 OMO 商家完全足夠。只有需要伺服器端容器（Server-side GTM）時，才會產生雲端主機的費用。
裝了 GTM 後，網站會變慢嗎？
GTM 採非同步載入，本身影響極小。真正影響速度的是你在容器裡放了多少代碼。維持代碼精簡、移除沒用到的，就能兼顧速度與追蹤。
已經用 gtag.js 直接裝了 GA4，還需要 GTM 嗎？
不是必須，但建議遷移到 GTM 集中管理。否則日後每加一個事件或像素都要改原始碼，長期維護成本高、也容易出錯。
GTM 的『預覽』和『提交』差在哪？
預覽只是讓你私下測試，不影響真實訪客；提交（並發布版本）才會把變更正式上線。測完務必記得提交，否則設定不會生效。
