GTM 除錯清單：11 個可能造成 GTM 代碼沒有啟動的原因
有時候我們設定好了代碼，打開預覽模式卻發現代碼沒有如我們預期的方式啟動，或是代碼明明顯示啟動了，但我的 GA4 卻接收不到任何的事件資料，偏偏老闆/主管/業主又急著要追蹤這個網站事件，有時卻抓破頭也想不透到底發生了什麼事情？此時就必須要進行 GTM 除錯這項程序了。
這篇文章將會告訴你，如果遇到這種情況發生，我們可以如何一步一步去檢查，找到可能發生的原因，不過發生的原因可能有上千上百種，這邊會列出幾個基本常見的設定錯誤，讓你可以先行檢查有沒有因為這些設定上的小錯誤，而影響了代碼啟動。
1. 打錯字
這大概是最常見的錯誤之一，也是最常被忽略的，我們往往把重點放在設定觸發條件的正確性，卻沒注意到 打錯字 這個可能性。
例如：在使用「點擊-僅連結」的觸發條件類型時，連結網址明明是 mktgholic.local/contact-us/，而在設定 Click URL 時卻硬是打成 mktgholic.local/contact_us/，就是「底線」跟「一槓」這麼細微的變化影響了全局。
或是變數選擇了 Click Text，你很有自信地用打字的方式進行設定，但卻因為打錯字而出了錯。
因此當遇到類似的情況時，一律建議到網站上使用「複製」並於 GTM 「貼上」，可以避免這樣的錯誤發生。
抑或我們 使用「可見度元素」觸發條件類型 時，在使用 CSS 選擇器或是選用 ID 的時候，輸入了錯誤的名稱，這也是很常見的，對於還不習慣閱讀 HTML 代碼的朋友來說，很容易打錯，在這種情況下，複製貼上絕對依然是你的好朋友。
因此，如果發現代碼沒有如預期般啟動，先檢查一下設定的觸發條件是不是打錯字了，這個最基本的錯誤往往可以一解你心頭的心煩意亂。
2. 把所有條件都放在同個 Trigger
這也是初期很常見的錯誤之一，之前的 文章 有提過，假設我們今天想要追蹤 3 個特定頁面，來到這 3 個頁面的使用者在執行某行為之後，啟動 GA4 事件代碼，我的網址可能是：
mktgholic.local/event/Xmas-Eve
mktgholic.local/event/Merry-Chrimas
mktgholic.local/event/New-Year-Ready
於是我設定了一個網頁瀏覽的觸發條件類型，將 3 個網址放置在一起，變成下圖這個樣子：
當然，這是行不通的，一個頁面只會有一個網址，不可能有同時存在 3 個網址的情況。
如果想知道如何處理這樣的情況，可以參考這篇文章內的段落： 如何在同一個觸發條件裡使用不同網址？
3. 觸發條件未符合或是部分符合
如果代碼沒有正確啟動，通常都是先看觸發條件是否有設定錯誤，我們可以透過預覽模式點選未如預期啟動的代碼卡片 ，拉到卡片最下方看是否有都打「綠勾」或是全部顯示「紅 X」，接著再去查看觸發條件的哪部分出現了問題。
或是如果我的「點擊-僅連結」觸發條件類型設定如下圖，當點擊的連結符合mktgholic.local/contact-us/ 同時該頁面主機名稱（Page Hostname）符合 mktgholic.com 時，啟動代碼。
只要有其中一個條件沒有滿足，我們就可以在預覽模式中去 點擊代碼卡片 看到圖中這樣的情況，此時就可以知道問題所在，因為是觸發條件設定有誤，必須要回到觸發條件中去修正。
4. 設定成一個頁面只能啟動一次代碼
在 代碼設定頁面 > 進階設定 > 代碼觸發選項 的設定中，如果選擇了「每個網頁一次」，顧名思義就是你的代碼在這個頁面上不管符合觸發條件多少次，都只會啟動一次。
最常見的部分就是頁面上設置了許多「點擊」追蹤事件，但因為設定了「每個網頁一次」，造成後面其他點擊都無法啟動事件代碼。不過這部分不需要太過擔心，通常在設定代碼時，不會去碰觸到這個地方，除非是有特定需求才會特別設定「每個網頁一次」這個代碼觸發限制。
另外要注意的就是，這個設定是 凌駕於所有觸發條件之上 的，儘管今天觸發條件都符合但因為「每個網頁一次」的限制，你的代碼卡片會變成像下圖這樣：
觸發條件全部都是「綠勾」，但代碼卻沒有觸發，這點是在設定時可以留意的部分。
5. 新增例外項目/狀況（觸發條件）
如果代碼沒有順利啟動，檢查一下代碼的觸發條件是否有設定「例外狀況」，有時你可能是接手前人設定的代碼，儘管整頁所有的點擊都會啟動代碼，唯獨某個連結不會，此時就可以想到該代碼是否有設定「例外狀況」（如下圖）。
如果透過預覽模式查看的話，我們一樣 點開未啟動的代碼卡片 ，可以看到在下方多了一個 Blocking Triggers 的區塊，這邊顯示的就是「例外狀況」中的觸發條件。
圖中可以看到，啟動代碼的觸發條件以及 Blocking Triggers 的觸發條件全都是綠勾，代表這個事件符合啟動的觸發條件但也符合「例外狀況」的條件，以優先度來看，「例外狀況」是最優先，因此代碼沒有啟動。
注意觸發條件類型要一樣
上一段我們解釋了「例外狀況」造成代碼不啟動的原因，但有時候我們希望同一頁面上某些代碼會觸發而某一些真的不會被觸發，我們就可以利用這個方式來處理。
但必須要注意的事情是，「例外狀況」的觸發條件類型需與啟動代碼的觸發條件類型是 一樣 的（如下圖），否則此「例外狀況」的設定便不會有效運作去阻止代碼的啟動。
反過來說，如果「例外狀況」的觸發條件類型與啟動代碼的觸發條件類型是不一樣的，以下圖為例，儘管使用者位在「例外狀況」條件的頁面中，那此代碼依然會被啟動，想要用「例外狀況」阻止代碼的啟動，你只能用同類觸發條件阻擋，異類觸發條件是無法溝通的。
6. 設定了觸發條件順序
前面講的都是如果代碼沒有成功啟動的話，我們可以從哪裡開始除錯，這段要講的則是相反的情況，如果你在預覽模式中看到奇怪的代碼啟動了，點開代碼卡卻發現沒有觸發條件？
這是怎麼一回事？
在預覽模式中，我們無法透過代碼卡片看到這個代碼啟動的前因後果，主要是因為它沒有被設定觸發條件，也因此無法得知代碼被啟動的原因。
此時我們就必須要回到 GTM 代碼（Tag）介面中，找到被啟動的代碼名稱，點進去會看到觸發條件顯示如下：
在 GTM 代碼設定中有一個功能，你可以設定在 當前代碼啟動之前或是之後啟動特定代碼 ，例如設定在 A 代碼啟動之後，也啟動 B 代碼，儘管 B 代碼沒有任何觸發條件也會被啟動，但嚴格來說，「A 代碼啟動之後」就是其觸發條件。
以上圖的範例可以看到，我們的代碼會在「GA4Event-Click_link」之後觸發，接著找到「GA4Event-Click_link」的代碼設定介面 > 展開進階設定 > 代碼觸發順序 就會看到相關設定，如下圖：
另外 還有一點需要注意 的是，如果今天代碼有被設定觸發條件以及代碼觸發順序，當這個代碼同時符合這兩個條件時，例如我們指定當使用者來到這個頁面時觸發一次代碼，同時該頁面有另個代碼啟動後也會觸發這個代碼，這個代碼是會被啟動 2 次的，這也可能造成數據錯誤的原因之一。
7. 設定了代碼啟動排程
GTM 的代碼是可以指定「只」在特定時間範圍裡啟動的，就像社群媒體貼文發布排程一樣，你可以在 代碼設定介面 > 進階設定 > 勾選自訂標記觸發時段 找到相關設定，有時候可能因為設定的代碼太多，你忘記了這個代碼被設定只能在特定時間範圍內啟動。
在預覽模式中點開代碼事件卡，你會看到 Blocking Trigger 區塊出現了不同的訊息，當看到「schedule_start_xxxxxx」這樣的資訊時，就可以知道代碼之所以沒有被觸發的原因了（因為被設定了時間排程）。
8. 只在已發布的容器中觸發這個代碼
在 代碼觸發設定介面 > 進階設定 > 只在已發布的容器中 觸發這個代碼 ，如果勾選了這個選項，顧名思義就是你在預覽模式中會看不到這個代碼的觸發，這也是除錯過程中可以檢查的項目，有時候一個帳號可能不只你一個人管理，當看到這個選項被勾選時，請記得先詢問其他共同操作者勾選的原因，再行調整。
如果有勾選這個項目，你在預覽模式的代碼事件卡中，Blocking Trigger 的部分是看不到任何阻擋代碼觸發的資訊，我們就只能回到代碼事件設定中去找原因。
9. 「引號」的問題
這是一個初期安裝 GTM 容器到網站上很常見到但又卻不容易發現的錯誤，最常發生在你把 GTM 安裝代碼複製貼上給工程師時，因為文字編輯器編碼的差異，造成你的 GTM 代碼被更改變成錯誤的代碼，交給工程師放到網站上之後發現整個 GTM 容器都沒有啟動。
原本的 GTM 代碼引號如下，很有可能因為不同文字編輯器的關係，複製貼上出來後變成其它的形式，這點是很常見卻不容易發現的地方，因此建議不要用 word 或是 Google Doc 這種文件來傳送代碼，也別直接貼在 Email 裡面。
（像是在編輯這篇文章時，我就無法打出代碼中的引號，會變成「‘」，這是錯誤的。）
<!-- Google Tag Manager -->
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});
var f=d.getElementsByTagName(s)[0], j=d.createElement(s),
dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })
(window,document,'script','dataLayer','GTM-M3345678');
<!-- End Google Tag Manager -->10. 被限制部署代碼
有些規模較大的網站，工程師團隊為避免網站被透過 GTM 安裝了影響網站運作的 Javascript 或是其它可能代碼，會在 Data Layer 資料層推送 allowlist 以及 blocklist 清單，控制 GTM 可以使用在網站上的代碼、觸發條件以及變數，更多詳細資料可以閱讀 官方資料 。
至於我們要怎麼知道工程師是否有在網站上進行了這樣的限制，我們一樣可以透過預覽模式來觀察，通常有限制部署代碼設定時，在 Consent Initialization 之前會有一個 Data Layer 的訊息，點開來看我們就可以看到被限制以及被允許的名單。
當發現這樣的限制影響了你的 GTM 追蹤設定，請與工程師部門聯繫，讓他們了解你想追蹤的項目，經他們評估是否會影響網站運作，再請他們將該項目從限制清單移除即可。
11. 代碼被「同意聲明模式」狀態拒絕
隨著各地區的隱私規範日漸嚴格，Google 為了因應法規，也開始要求使用其部分服務需要取得使用者同意，並傳送「Google 同意聲明模式」讓 Google 知道使用者同意與否。
除了善用「Google 同意聲明模式」控制與 Google 服務相關的追蹤代碼以外，我們也可以用其來控制其他代碼，透過 GTM 內建的「同意聲明總覽」進行設定，因此如果發現網站的代碼沒有正確啟動，我們也可以檢查一下是否因為同意聲明模式狀態為 denied 的關係所造成。
如果是因為這個原因，你會在預覽模式中看到如下圖的畫面：
進一步點開代碼卡片的話，可以看到儘管觸發條件滿足，上發出現了一排紅字 Not fired due to missing consent，更可以確認代碼因為同意聲明狀態為 denied 所以沒有啟動。
因此，如果發現代碼沒有正確啟動，除了檢查是否有我們前面提到的那些因素以外，檢查「同意聲明模式」所造成的代碼封鎖狀況也是可以注意的地方。
如果你對於「Google 同意聲明模式」尚不熟悉，可以參考這篇文章：如何用 GTM 設定 Google 同意聲明模式（Consent Mode）?
如果發現代碼真的是因為這個原因所以沒有啟動，有任何需要調整設定的地方，則可以參考這篇文章進行操作：如何用 GTM 的「同意聲明總覽」控制代碼的啟動？
總結
這篇文章列出的 10 個較常出現且容易被忽略的錯誤，打錯字或是 CSS 選擇器選取錯誤大概會讓很多使用 GTM 的朋友有些共鳴，例如明明是 class 卻在 GTM 中給了「#」，ID 卻給了「 . 」，或是引號因為編碼的關係複製貼上交給工程師之後代碼也因此變形。
會造成代碼出錯或是無法啟動的狀況還有很多，相信有很多是我們還沒遇到的，因此本篇文章提到的當然不會也無法涵括全部，未來如果有出現其它我們認為值得提出來讓大家知道的除錯檢查，也會再更新到文章當中，最後我們總結一下這 10 個可能的錯誤：
- 打錯字
- 把所有條件都放在同個 Trigger
- 觸發條件未符合或部分符合
- 設定成一個頁面只能啟動一次代碼
- 新增例外項目/狀況（觸發條件）
- 設定了觸發條件順序
- 設定了代碼啟動排程
- 只在已發布的容器中觸發這個代碼
- 「引號」的問題
- 被限制部署代碼
下次代碼有問題時，可以將此篇文章當成檢查清單，一步一步確認是否有地方出錯喔！
