gtm 教學的核心流程有五步：建立帳戶與容器、把兩段安裝程式碼放進網站每一頁、設定代碼與觸發條件、用預覽模式確認代碼正確觸發，再提交並發布版本。Google 代碼管理工具（Google Tag Manager，簡稱 GTM）讓你在網頁介面中新增與修改追蹤代碼，不必每次都請工程師改網站程式。以下這份 Google Tag Manager 教學依實際操作順序，說明每一步要填什麼、怎麼判斷設定成功，以及用 GTM 安裝 GA4 時要注意的地方。
開始前要準備的帳號與資料
動手之前先準備好下面幾項，避免設定到一半卡住：
- Google 帳戶：建議用公司可以交接的帳戶建立，日後人員異動時才不會失去管理權。
- 網站修改權限：能編輯網站範本，或能登入 WordPress、Shopify、Wix 等架站平台的後台。
- GA4 評估 ID：在 GA4 的「管理」頁面，從「資料收集和修改」進入「資料串流」，點選網站資料串流即可看到，格式為 G- 開頭。
- 追蹤清單：列出要追蹤的動作，例如表單送出、電話點擊、加入購物車、完成購買，以及每個動作發生在哪一頁、要用什麼條件判斷。
追蹤清單是設定觸發條件的依據，寫得越具體，觸發條件越容易寫對。
建立帳戶與容器的步驟
GTM 的架構是帳戶底下放容器，通常一家公司一個帳戶、一個網站一個容器。容器是指安裝在某個網站上的代碼、觸發條件、變數與相關設定的組合。
- 前往 tagmanager.google.com 並登入 Google 帳戶。
- 在「帳戶」分頁選取「建立帳戶」，輸入帳戶名稱並選擇國家/地區。
- 輸入容器名稱。官方說明指出，網站容器的名稱要用網站的頂層網址，例如 www.example.com。
- 選擇容器類型。一般網站選「網頁」；另有 iOS、Android、AMP 與伺服器等類型，分別對應應用程式、AMP 網頁與伺服器端代碼管理。
- 按「建立」並同意服務條款，畫面就會出現安裝程式碼。
安裝程式碼要放在網頁哪個位置
建立容器後會拿到兩段程式碼。之後若要再找，可以在「工作區」分頁點選開頭為 GTM 的容器 ID，開啟「安裝 Google 代碼管理工具」對話方塊。兩段程式碼的位置不同：
- 前段程式碼：貼在網頁的 head 區段內，位置盡量靠上。
- 後段程式碼：緊接在 body 開頭標記之後。
兩段都要出現在網站的每一個頁面，實務上會放進共用的頁首範本。如果網站是用 WordPress、Shopify、Wix 這類網站製作工具或內容管理系統架設，官方說明指出可以透過平台的整合功能設定，不必修改每一頁的程式碼。安裝前先確認主題、外掛或前一位負責人是否已經裝過同一個容器，避免重複載入。貼好之後，可以在安裝對話方塊輸入網址並按「測試」確認。
代碼、觸發條件與變數的分工
GTM 的設定由三種元件組成：
| 元件 | 負責什麼 | 常見例子 |
|---|---|---|
| 代碼 | 要執行的程式碼片段，通常由分析或廣告平台提供 | Google 代碼、GA4 事件、廣告轉換追蹤 |
| 觸發條件 | 監聽網頁上的事件，符合條件時啟動或封鎖代碼 | 網頁瀏覽、點擊、表單提交、自訂事件 |
| 變數 | 執行時才填入實際值的具名預留位置，用在篩選條件或代碼欄位 | Page URL、Click Text、Click URL |
觸發條件預設在每次事件發生時都會啟動，若只想在特定頁面或特定按鈕觸發，就要加上篩選器。篩選器由變數、運算子與值組成，例如「Page URL 包含 /thank-you/」。內建變數能處理多數情況，遇到特殊需求，例如要讀取網站寫入資料層的訂單資訊，再建立使用者定義變數。
GTM 搭配 GA4 的設定方式
用 GTM 安裝 GA4 分成兩步：先裝 Google 代碼讓 GA4 開始收資料，再依追蹤清單加上事件代碼。
建立 Google 代碼
- 在工作區的「代碼」頁面新增代碼，取一個好辨識的名稱。
- 代碼類型選擇「Google 代碼」，在「代碼 ID」欄位填入 GA4 的評估 ID。
- 觸發條件選用初始化類型，讓代碼在網頁載入的初始化階段就啟動。
- 儲存設定。
加上 GA4 事件代碼
要追蹤按鈕點擊或表單完成，就新增類型為「Google Analytics：GA4 事件」的代碼，填入評估 ID 與事件名稱。觸發條件依動作而定：點擊按鈕可用「所有元素」類型並限定點擊文字；送出後會跳轉到確認頁的表單，可用「網頁瀏覽」觸發條件限定確認頁網址。事件進到 GA4 後，再到「管理」的「資料顯示」中，從「事件」把它標示為重要事件（也就是過去所稱的轉換）。事件名稱與參數怎麼規劃，可以參考GA4 事件追蹤設定的整理。
用預覽模式與 Tag Assistant 驗證
設定完不要直接發布，先在預覽模式確認每個代碼都照預期觸發：
- 在「工作區」分頁按右上方的「預覽」，瀏覽器會在新分頁開啟 Tag Assistant。
- 輸入網站網址並按「連線」，網站開啟後右下角會顯示「已連結」。
- 在網站上實際做一次要追蹤的動作，例如送出測試表單。
- 回到 Tag Assistant，查看哪些代碼已觸發、觸發的順序，以及各個觸發條件是否成立。
- 測完後按「停止偵錯」結束預覽。
判斷成功有兩個重點：該觸發的代碼在對的事件下觸發而且只觸發一次，不該觸發的頁面也沒有誤觸。代碼沒有觸發時，先檢查篩選值和實際網址或按鈕文字是否一致，再確認這項修改是否還停留在別的工作區。若連線後網站顯示異常，可能是網址中的偵錯參數讓部分網站出錯，可取消勾選「在網址中加入偵錯信號」再試。
提交發布與版本回復
預覽確認無誤就可以發布：
- 按畫面右上角的「提交」，開啟「提交變更」畫面。
- 選取「發佈及建立版本」，填寫版本名稱與版本說明。
- 確認發布，設定才會套用到網站。
版本是容器設定在某個時間點的快照。版本說明要寫清楚這次改了哪些代碼與原因，例如「新增詢價表單送出事件」，出問題時才找得到是哪一版造成的。若發布後發現錯誤，可以在版本清單中對舊版本選擇「設為最新版本」，再重新發布一次，網站就會回到那一版的設定。多人共同管理時可以各自使用工作區；若工作區落後於已發布的版本，系統會提示工作區過舊並要求更新；更新時若與其他版本的變更衝突，再用「解決衝突」逐項處理。
常見問題
GTM 和 GA4 有什麼不同？
GTM 是管理與部署代碼的工具，本身不產生報表；GA4 是收集資料並呈現報表的分析工具。常見做法是用 GTM 部署 GA4 的代碼與事件，再到 GA4 看報表。
網站原本就裝了 GA4 程式碼，改用 GTM 要注意什麼？
先盤點原本直接寫在網頁上的程式碼，改用 GTM 部署後只保留一種安裝方式，並在預覽模式確認網頁瀏覽沒有重複送出，避免同一個事件在報表中被算兩次。
一個網站需要幾個容器？
一般一個網站對應一個網頁容器就足夠，所有代碼集中在同一個容器管理。公司若有多個網站，可以放在同一個帳戶下各自建立容器，版本紀錄也會分開保存。
開啟預覽模式時，一般訪客會看到偵錯畫面嗎？
不會。偵錯介面只會出現在啟用預覽模式的那個瀏覽器，一般訪客看到的仍是已發布版本的網站，所以可以在正式網站上測試尚未發布的設定。
不會寫程式可以自己設定 GTM 嗎？
常見的 Google 代碼、GA4 事件，以及點擊、表單類的觸發條件，都能用介面選單完成。若要讀取訂單內容這類網站內部資料，通常要由工程人員先寫入資料層，再由 GTM 讀取。
本文由京采數位科技整理。我們自 2005 年起提供官網設計、系統開發與 Google SEO 服務，實際案例可見成果與案例。
想直接討論你自己的網站狀況，或需要一份初步的搜尋機會評估？
相關主題
下一步
容器建好之後，下一步是把追蹤清單逐項做成代碼與觸發條件，每完成一項就用預覽模式驗證，再集中發布並寫好版本說明。如果網站留有前人建立的容器、不確定哪些代碼還在運作，京采的轉換優化與數據追蹤服務可以協助盤點現有代碼、規劃 GA4 事件與重要事件，並在發布前完成測試。想先討論目前的設定，歡迎與我們聯繫。
