GTM 觸發條件介紹：我們該在「何時」使用「何種」觸發條件？

了解在「何時」使用「何種」 GTM 觸發條件是初學 GTM 時必須掌握的關鍵，如果你沒有準確告訴 GTM 代碼應該在何時啟動，或者設定了錯誤的觸發條件，即使代碼本身設定無誤，也將無法正常運作。

這篇文章將帶領你初步了解各種觸發條件的應用場景，並透過日常行銷活動的實例說明，讓你了解何時應該使用哪種觸發條件，當面臨新的事件追蹤需求時，將能立即思考如何設定相應的追蹤事件。

此外，有些段落會提供「進階閱讀」的文章，由於這篇文章主要針對初學 GTM 的朋友，因此初學的你可以選擇先略過這些進階文章（擔心你一下子搞混）。

不過這並不會影響你對觸發條件的理解。除非某些追蹤事件與你當前的需求相符，那麼可以先按照文章內容的步驟操作一遍，以解決當前的需求優先。

網頁瀏覽類型觸發條件

在繼續閱讀這篇文章之前，可以先看看文章：「認識 GTM 網頁觸發條件：同意聲明初始化、初始化、網頁瀏覽、DOM 就緒以及視窗已載入」，該篇文章中，我們對於「網頁瀏覽」類型的觸發條件做了更詳細的解釋，包含了在預覽模式中為什麼會看到這些名稱，以及對網址結構的介紹，這些會幫助你更清楚地理解其運作原理。

接下來，我們開始進入正題。

ㅤ

DOM 就緒(DOM Ready)

「DOM 就緒」表示當網頁的文件物件模型（DOM）已經被完全載入並且可以被JavaScript 的腳本訪問時，觸發條件成立，可以觸發代碼，通常用在當我們需要「抓取」網頁上某個文字或是值的時候，例如訂單頁面的金額，我們就會需要用到觸發條件「DOM 就緒」，有助於避免由於 JS 腳本執行時因為 DOM 還沒有完全加載而引起錯誤。

舉個例子：
可能因為某些原因，我們無法推送電子商務資訊到網站的資料層（Data Layer），但又需要抓取訂單完成頁面的金額。

此時就會設定一個 JS 代碼來抓取頁面上的數字，並在網頁的文件物件模型（DOM）已經被完全載入之後才啟動，以確保代碼可以抓到我們要的數字或是文字，此時該代碼的觸發條件就必須要使用「DOM 就緒」。

如果初學的朋友看完之後還是摸不著頭緒，可以先略過「理解什麼是 DOM？」這件事情。

這個觸發條件的使用情境大多是當我們無法直接將資料推送到網站的資料層，但又需要在特定情況下捕獲頁面上的某些資訊時，比較會去使用。

如果有辦法將資料推送到資料層，那麼最好使用資料層（Data Layer）作為抓取資料的首選方法。

進階閱讀》什麼是 DOM？什麼是「DOM 元素」變數

ㅤ

初始化(Initialization)

這個事件緊隨「同意聲明初始化」之後觸發，但發生在網頁完全載入之前。透過這個觸發條件啟動的代碼會在網頁加載之前先行啟動，等待著「捕捉」我們需要追蹤的資訊或啟動其他事件。因此，如果你希望某些代碼能夠盡快啟動，選擇「初始化」就很適合。

比如，GA4 追蹤代碼通常建議在整個頁面「初始化」階段啟動。其他如 Meta 或是 Google Ad 廣告轉換追蹤碼等也常使用此觸發條件，以確保在網頁載入時，率先啟動這些代碼。

Google 官方就建議其觸發條件選擇「初始化 – 所有網頁觸發條件（Initialization – All Pages）」

ㅤ

這個是在網頁載入時最優先啟動的。由於網路隱私保護以及個資管理法規的要求，當網站有收集使用者資訊的行為時（例如我們透過 GTM 裝設的追蹤事件或是 GA4 代碼），必須要先獲得使用者的同意，才可以進行這些追蹤。（不同國家和地區有不同的法律規範）

如果你的追蹤代碼需要在獲得使用者同意後才能啟動，那麼就必須在網頁載入時的最初階段先行啟動同意聲明工具，讓使用者進行選擇，此時你就應該使用這個觸發條件。

舉例來說，如果你的網站透過 GTM 安裝了「同意聲明彈出窗口」，你需要在使用者首次載入網頁時就啟動這個彈出窗口，讓他們選擇是否同意網站進行追蹤和分析行為資料。

只有在使用者同意之後，其他的代碼才能在必要時被啟動，這就是「同意聲明初始化」觸發條件的作用。

ㅤ

網頁瀏覽(Page View)

此觸發條件很容易理解，正如其名，用於指定當使用者訪問網頁時應該觸發的條件，是在網頁開始載入後才會啟動代碼的觸發條件，啟動順序位於「初始化」之後，這個觸發條件主要用於追蹤用戶在網站上的瀏覽活動，例如頁面加載、重新載入或者移動到另一個頁面，像是我們要在網站某一個感謝頁面設置一個轉換追蹤事件時，就很常會用到「網頁瀏覽」觸發條件。

例如：
當使用者提交表單之後，網頁跳轉到感謝使用者提交表單的頁面，頁面上可能會顯示「感謝您的填寫，將會有專人盡快與您聯繫」之類的訊息。

此時的網址通常會是 www.abc.com/thanks-your-submission ，同時也是該網站獨一無二的網址，就會使用這個網址來設定觸發條件並啟動轉換事件代碼（如下圖）。

ㅤ

視窗已載入(Window Loaded)

這個觸發條件表示當網頁的整個內容，包括 HTML、CSS、DOM 元素、JavaScript 還有第三方的 JS 腳本或代碼都已經完全載入時，與其綁定的代碼才會啟動。

當需要追蹤第三方軟體時，我們會使用觸發條件「視窗已載入」，例如當網站有裝設外掛的聊天機器人時，為了有正確的追蹤數據，就必須要使用這個觸發條件，確保整個網頁都已完全載入網頁之後（包含第三方軟體），才啟動追蹤代碼。

除此之外，也可以用來提升特定追蹤事件數據的準確性，有些人會把原本的 GA4 page_view 事件關閉，另外做一個 page view 事件與這個觸發條件綁定，確保使用者是「真的」有看完整個頁面的內容。

但這麼做也有缺點，當你的網站載入速度太慢時，使用者沒耐心等待就離開，此時因為視窗沒有載入完全，綁定這個觸發條件的代碼就不會觸發。

點擊

ㅤ

僅連結(Just Link)

最常使用的觸發條件之一，尤其是網站上有許多連接需要追蹤的網站，會更常使用到這類型的觸發條件，這是用來指定只有當使用者點擊了網頁上的連結時，觸發某些事件代碼，簡單來說，它確保網站的追蹤代碼只有在用戶點擊了連結時觸發，而不是在頁面載入或其它互動時觸發。

這可以幫助我們追蹤特定連結的點擊次數或執行特定操作的情況，例如，當使用者點擊了訂閱按鈕或下載連結時。

不過，需要注意的是，這個觸發條件只能在連結是 html 標籤 <a></a> 的時候才能使用，像是下方這樣的連結結構：

進階閱讀》如何用 GTM 建立 GA4「連結點擊」事件？

ㅤ

所有元素(All Elements)

這個觸發條件是當任何網頁元素被點擊時，相對應的代碼就會被啟動的觸發條件，例如按鈕、圖片甚至是網頁上任何一個地方，假設想要追蹤網站上任何按鈕的點擊事件，可以使用「所有元素」觸發條件，這樣當頁面上任何按鈕被點擊時，相應的追蹤事件代碼就會啟動，並傳送資料到 GA4。

因此這也表示，你可以用「所有元素」作為觸發條件追蹤 <a></a> 連結的點擊，但是不能用「僅連結」作為觸發條件追蹤如按鈕、圖片等其他元素的點擊。

使用者參與(User Engagement)

ㅤ

Youtube 影片(Youtube Video)

這個觸發條件讓你可以追蹤人們在你的網站上看 YouTube 影片（嵌入式的影片）的行為，像是按播放、暫停、或是停止，也可以觀察到使用者看到影片多少百分比的位置。（只有 Youtube 影片可以被追蹤，其它平台的影片要另外寫 JS 去追蹤）

比方說，假設你想知道有多少人在你網站上觀看了你嵌入的 YouTube 影片，你可以設定一個「Youtube 影片」觸發條件，當人們按下播放鍵時，就會觸發 Google Analytics 或其他追蹤工具來記錄這個事件，這樣你就可以知道使用者觀看影片的情況了。

ㅤ

元素可見度(Element Visibility)

這個觸發條件可以讓你追蹤使用者在網頁上滾動時，如果看到某個元素的時候，觸發一些事件的條件。簡單來說，就是當特定的元素出現在使用者的畫面上時，你可以執行一些動作。

比方說，假如你的網站上有一個橫幅廣告，你希望使用者滾動到頁面時，如果看到了這個橫幅廣告，就觸發一個事件，像是記錄這個橫幅廣告的曝光並發送到 GA4。

此時你就可以使用「元素可見度」觸發條件。

這可以讓你能夠追蹤特定元素在使用者的螢幕上變得可見時的互動情況，有助於更好地了解使用者的行為和互動。

進階閱讀》如何用「元素可見度」追蹤站內廣告曝光？

ㅤ

捲動頁數(Scroll Depth)

這個觸發條件是用來追蹤使用者在瀏覽網頁時捲動了頁面多少百分比的觸發條件。簡單來說，就是當使用者在同一個網頁上捲動到一定程度時，就會觸發相應的事件代碼。

假設你想知道有多少人在你的部落格文章中捲動了超過整個頁面的 50% 或是 75% 等，以了解使用者對於你的內容是否真正的有興趣，就可以使用這個觸發條件。

GA4 的加強型評估事件中有預設這個事件，不過其判斷方式是當使用者捲動到畫面 90% 的時候，才會觸發事件，因此如果你有其它頁面百分比的追蹤需求，就必須使用這個觸發條件來設定。

進階閱讀》如何用 GTM 設定「網頁捲動」追蹤事件？

ㅤ

表單提交(Form Submission)

「表單提交」觸發條件就是指當使用者在網站上提交表單時觸發的條件，當有人填完表單，然後按下送出（提交）按鈕時，你可以藉此觸發一些特定的動作或者事件。

舉個例子，假設你的網站上有一個訂閱表單，當使用者填寫完畢並點擊「訂閱」按鈕時，你希望觸發 Google Analytics 或其他分析工具來追蹤這次訂閱事件，或者彈出一個感謝訊息給使用者。這時你就可以使用「表單提交」觸發條件，當使用者提交表單時觸發相應的追蹤代碼或行為。

不過呢，因為現在大部分的表單都設計成不會跳轉到感謝頁面，而是用 Ajax 在沒有跳轉頁面的情況下出現成功提交訊息，因此現在比較普遍的追蹤方式是改用「Javascript 監聽器」或是觸發條件「元素可見度」、以及「自訂事件」的方式來處理。

進階閱讀》
如何用 GTM 設定 GA4「表單提交」事件？追蹤表單是否成功提交？
如何用 Data Layer Push 設定 GTM「表單提交」事件？

其它觸發條件

ㅤ

JavaScript 錯誤(Javascript Error)

正如其名，「JavaScript 錯誤」觸發條件是指當網頁上發生 JavaScript 錯誤時觸發的條件，就是當網頁的 JavaScript 代碼出現了錯誤，其腳本執行起來的不如原先預期或是腳本出現 error，你可以設定一些動作或事件來處理這些錯誤情況。

這個觸發條件可以與 GTM 預設的內建變數「Error message」、「Error URL」以及「Error Line」搭配使用，當錯誤發生時，便會回傳錯誤的訊息、發生錯誤的頁面網址以及告訴我們是在腳本的哪一行出錯，屆時便可以將這些資訊回傳到 GA4 當中紀錄。

左側介面選擇「變數」> 點擊內建變數區塊右上角「設定」> 往下捲動到「錯誤」區塊

舉個例子，假設你的網站上有一個重要的 JavaScript 功能，比如加載動畫內容或是加載聊天機器人，但有時候因為某些原因，這個功能會出現錯誤，使得用戶無法正常使用，此時就可以使用「JavaScript 錯誤」觸發條件，當這些錯誤發生時，立即觸發一個事件或者發送一個通知給你的團隊，以便及時處理和修復問題。

ㅤ

自訂事件

當你越來越熟悉 GTM 之後，會有越來越多的機會使用到「自訂事件」觸發條件，尤其是在設定 GA4 的電子商務事件時，都是用「自訂事件」觸發條件來進行追蹤事件的代碼設定，所以這是一個你絕對要去熟悉的觸發條件類型。

舉個例子，在 GA4 電子商務事件的官方文件中，將購買事件推送到資料層 Datalayer 代碼如下圖：

當我們請工程師在網站的結帳完成頁面上安裝這段代碼之後，便會在使用者完成購買之後，推送購買事件以及相關資訊到資料層，此時我們就可以利用其中的 event : "purchase" 來設定「自訂事件」觸發條件。

ㅤ

觸發條件群組(Trigger Group)

你可以把這個觸發條件可以想像成一個包裹，裡面可以放置一個或多個觸發條件，這些觸發條件通常是用在當使用者在網站上進行的一系列操作，例如：

當使用者捲動頁面達到 90% 且在該頁面停留超過 1 分鐘時，啟動特定代碼。

或是

當網頁的 Dom 都載入完畢之後，且資料層有購買事件時，觸發「購買」事件的代碼。

「觸發條件群組」就是一個容器，裡面放置了一系列觸發條件，只有當所有這些條件都被滿足時，才會被觸發。這樣就可以更精確地追蹤使用者特定行為，從而更好地了解用戶的行為模式和優化網站體驗。

另外，我們也有一篇文章，有詳細的講解觸發條件的應用方式，可以參考：GTM 觸發條件介紹：用「觸發條件群組（Trigger Groups）」了解使用者體驗

ㅤ

計時器(Timer)

「計時器」觸發條件就是一個碼錶，它可以在特定的時間到達後，去觸發某些事件或動作。

舉個例子，假設你想要追蹤用戶是否有在特定頁面停留到期望的時間，你可以使用「計時器」觸發條件來定義一個計時器，比如當使用者在頁面上停留超過 2 分鐘時，觸發追蹤事件或者其他操作，這樣就可以知道進站的使用者在網站上停留的時間長度，從而了解他們對該頁內容是否有興趣。

不過這只是一個很初步的行為追蹤方式，通常可能還會搭配是否有點擊文末 Call to action 連結或是是否有捲動到頁面固定百分比的位置來一起判斷使用者行為，關於「計時器」觸發條件的應用，可以參考這篇文章：GTM 觸發條件介紹：用「觸發條件群組（Trigger Groups）」了解使用者體驗。

ㅤ

用來延遲代碼載入時間

除了上述的使用方式之外，我們也可以用「計時器」觸發條件來延遲載入特定的代碼，例如聊天機器人或是特定的非必要在初期載入的代碼，加快網頁載入的速度（嚴格說起來其實不是加快，只是延後，不要讓所有代碼在擠在同一個時間點載入，就會讓使用者「感覺」變快了。）

ㅤ

記錄變更(History Change)

「記錄變更」觸發條件可以幫助你追蹤使用者在網站上的瀏覽行為，像是用戶按了瀏覽器的上一頁或下一頁按鈕，或者改變了網址，當使用者不斷瀏覽網頁時，我們的瀏覽器就會有歷史紀錄產生，這也是為什麼我們可以透過瀏覽器的上、下頁按鈕回到先前瀏覽頁面的關係。

這個觸發條件通常都是應用在追蹤一頁式的網站，在 GA4 的加強型評估事件中也同樣提供了這個功能。

進階閱讀》
如何用 GTM「記錄變更」& GA4 內建事件追蹤一頁式網站？

補充一下

觸發條件在資料層中另有別名

其實所有的觸發條件，在資料層中都有另外一個看起來比較不那麼平易近人的名稱，而其相對應的資料層鍵值對（key pair value）名稱如下：

「同意聲明初始化」對應的是 gtm.init_consent
「初始化」對應的是 gtm.init
「網頁瀏覽」對應的是 gtm.js
「DOM 就緒」對應的是 gtm.dom
「視窗已載入」對應的是 gtm.load
「僅連結」對應的是 gtm.click
「全部元素」對應的是 gtm.click
「元素可見度」對應的是 gtm.elementVisibility
「表單提交」對應的是 gtm.formSubmit
「捲動頁數」對應的是 gtm.scrollDepth
「Youtube 影片」對應的是 gtm.video
「自訂事件」沒有對應任何東西，因為這是由你自己設定的
「記錄變更」對應的是 gtm.historyChange
「Javascript 錯誤」對應的是 gtm.pageError
「計時器」對應的是 gtm.timer
「觸發條件群組」對應的是 gtm.triggerGroup

上述這些名稱，你都可以在預覽模式中看到，點擊左邊介面的事件名稱，接著找到右側資料層（Data Layer）頁籤，就可以看到相關資訊。

進階閱讀》如何用 GTM 「預覽模式」檢查代碼有無設定成功？

ㅤ

等待代碼(wait for tags)

在「僅連結」的觸發條件中有個「等待代碼」的選項，這個功能可以讓使用者在點擊連結之後，先暫停住頁面，不讓其跳轉到下一頁，以確保點擊追蹤的事件代碼有正確啟動。

勾選後，預設等待時間是 2 秒鐘（2,000 毫秒），也就是說，當使用者點擊連結之後，會暫停 2 秒的時間才會跳轉到新的頁面或是開始下載檔案，目的就是要等待相對應的「點擊追蹤事件代碼」啟動。

但如果代碼在使用者點擊後只花了 0.5 秒就啟動，那頁面也會馬上跳轉，不會一定要等到 2 秒鐘的時間才導向到下一個頁面。

ㅤ

計時器會重新設定

如果有使用「計時器」觸發條件，有一點需要注意的是，當使用者重新載入頁面時，整個計時器會重新開始計時，不會累積。

ㅤ

觸發條件也可以用來阻止代碼啟動

水能載舟，亦能覆舟，一兼二顧，摸蛤仔兼洗褲，我們除了可以用觸發條件來啟動特定代碼以外，也可以用來「阻止」特定代碼的啟動。

舉個例子：
假設我想要在所有網址帶有 /blog 的頁面啟動一個追蹤代碼，但是唯獨一個網址帶有 /blog/I-dont-want 的頁面，我不希望該代碼在那個頁面上被啟動，這時我們可以在代碼中的「新增例外項目」部分加入該特定網址的觸發條件，這樣就可以阻止代碼在那個頁面上被觸發。

有兩點該注意的是：

要用來「阻止」代碼啟動的觸發條件，必須要跟啟動代碼的觸發條件是同類型的，以上圖為例，用來啟動代碼的觸發條件類型是「網頁瀏覽」，那「阻止」代碼啟動的觸發條件類型也必須是「網頁瀏覽」。
「阻止」代碼啟動的觸發條件優先級大於啟動代碼的觸發條件，如果網頁符合「阻止」代碼啟動的條件，儘管我們當下條件同樣符合啟動代碼的觸發條件，那代碼依然不會觸發。

總結一下

現在，你已經了解到自己的工具箱中有哪些「工具」，幫助你在未來面對各種網站追蹤需求時，可以馬上想到該用什麼「工具」去解決，避免出現明明是要用螺絲起子去把螺絲鎖進去，你卻拿著榔頭想要把螺絲敲進洞裡的情況。

而這篇文章的目的是讓初學 GTM 的朋友對於各種觸發條件有一個基本的了解，或許在閱讀完之後仍會有些疑惑，但不用擔心，這是很正常的，這也是為什麼我們建議不只是坐著看，而是要實際動手操作的原因，透過實際的操作，你會更加熟悉這些運作原理。

延伸閱讀

如果你很喜歡這篇文章並且覺得內容有幫助，又剛有些多餘時間，歡迎看看其它文章，繼續探索（這坑？這地獄？這片樂土？）

同時，如果對於內容有疑問或是建議，也歡迎你留言告訴我們：）