有問題可以在文章底部留言

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

Google Tag Manager Haran 2年前 (2024-12-12) 1578次瀏覽 0條留言

更新時間:2026年6月11號

在GTM中,許多代碼(Tag)都需要搭配「網頁瀏覽觸發條件」才能正常執行。

例如:

  • GA4頁面瀏覽追蹤
  • Google Ads轉換追蹤
  • Meta Pixel安裝
  • 第三方分析工具載入

都會使用到網頁瀏覽觸發條件。

不過許多剛接觸GTM的使用者經常搞不清楚:

  • Page View、DOM Ready、Window Loaded 有什麼差別?
  • 為什麼有時候標籤沒有觸發?
  • 應該選擇哪一種觸發條件?

本篇將完整介紹GTM五種網頁瀏覽觸發條件,以及各自的使用情境與最佳實務。

什麼是網頁瀏覽觸發條件?

網頁瀏覽觸發條件是 GTM最常用的觸發器類型之一。

它的作用是在網頁載入過程中的特定時間點觸發標籤。

在GTM裡點擊「觸發條件」——「新增」——「請選擇觸發條件類型以開始設定…」,即可看到「網頁瀏覽」相關觸發條件:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

GTM網頁瀏覽觸發條件有哪些?

GTM共提供五種網頁瀏覽相關觸發條件:

觸發條件 Data Layer 事件 觸發時間
同意聲明初始化(Consent Initialization) gtm.init_consent 最優先執行
初始化(Initialization) gtm.init 所有觸發器之前
網頁瀏覽(Page View) gtm.js GTM 載入後立即執行
DOM 就緒(DOM Ready) gtm.dom HTML 結構完成後
視窗已載入(Window Loaded) gtm.load 所有資源載入完成後

同意聲明初始化

Consent Initialization是GTM中最早執行的觸發條件。

資料層事件名稱是gtm.init_consent

主要用於Cookie Consent、CMP的安裝,因為它的執行優先權最高,因此能確保使用者同意狀態在其他標籤觸發前就完成設定。

適用情境:Cookie同意管理、Consent Mode v2 GDPR、CCPA等隱私法規需求

 

初始化

Initialization 是 GTM 中第二早執行的觸發條件。。

資料層事件名稱是gtm.init。

它會在絕大多數觸發器之前執行,如果有一些程式碼必須盡早載入,可以考慮使用此觸發條件。

適用情境:初始化JavaScript、設定全域變數、載入重要追蹤工具

 

容器已載入

Page View又稱為網頁瀏覽/容器已載入,當GTM容器載入完成後便立即觸發,能夠盡快送出資料,避免使用者快速離開網站而造成資料遺失。

資料層事件名稱是gtm.js。

適用情境:GA4頁面瀏覽追蹤、第三方追蹤工具

 

 

Dom就緒

DOM Ready 代表瀏覽器已完成 HTML 文件解析,並建立完整的 DOM 結構,此時網頁元素已經可以被 JavaScript 存取

資料層事件名稱是gtm.dom。

適用情境如果想從網頁元素中獲資料,可以用Dom就緒,因為此時已經建構完整個網頁,確保能夠為能夠獲取正確的值。

 

視窗已載入

Window Loaded 會在所有資源下載完成後才觸發。

資料層事件名稱是gtm.load:

適用情境:必須等待所有資源完成載入的功,如網站效能監測、頁面完全載入時間計算

 

 

GTM網頁瀏覽觸發條件執行順序

每次頁面載入時,觸發順序如下:同意聲明初始化>初始化>網頁瀏覽(也叫容器已載入)>DOM就緒>視窗已載入。

可以在GTM點擊『預覽』,然後在Tag Assistant裡看:GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

每個頁面瀏覽都會是這樣的順序

 

 

 

GTM應該選擇哪種網頁瀏覽觸發條件?

這是許多初學者最常問的問題。

以下是實務上的建議:

使用情境 建議觸發條件
GA4 頁面瀏覽 網頁瀏覽
Google Ads 轉換追蹤 網頁瀏覽
Meta Pixel 網頁瀏覽
擷取頁面元素內容 DOM 就緒
Cookie Consent 同意聲明初始化
初始化程式碼 初始化
網頁載入速度分析 視窗已載入

大多數情況下,建議優先使用網頁瀏覽/容器已載入,因為它能最快送出追蹤資料,降低使用者快速離站造成的資料流失問題。

如何限定特定頁面才觸發?

除了所有頁面觸發外,GTM也能限制特定網址才執行標籤。

僅在單一頁面觸發

假設在頁面Page A觸發,可以這樣做設定:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

 

在多個頁面觸發

假設在頁面Page A和Page B觸發。

錯誤的設定方式:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

設置兩個的時候,是同時滿足這兩個才觸發,所以這個設定實際是不會觸發的。

 

正確的設定方式:GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

當有多個頁面的時候,需要用“與規則運算式相符”的方式。

 

 

如何排除特定頁面不觸發?

以為網頁瀏覽觸條件為例,假設Page  A不觸發。

方法一:使用「不包含」

直接使用觸發條件裡的不包含:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

 

方法二:使用例外觸發條件(Exception)

代碼裡的“新增例外項目”也可以起到排除的作用:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

添加後的效果:

GTM網頁瀏覽觸發條件:Page View、DOM Ready、Window Loaded差異與使用時機

總結

GTM提供五種網頁瀏覽觸發條件,每一種都有不同的用途。

如果不知道該選哪一種,可以記住以下原則:

  • GA4、Google Ads、Meta Pixel:使用同意聲明初始化Page View
  • 需要抓取頁面元素:使用DOM Ready
  • Cookie 同意管理:使用Consent Initialization
  • 初始化程式碼:使用Initialization
  • 效能監測或等待全部資源載入:使用Window Loaded

對大部分網站而言,網頁瀏覽/容器已載入已經足夠應付90%以上的追蹤需求。透過正確理解各觸發條件的執行時機,可以避免標籤漏發、資料錯誤或追蹤失敗等問題。


如果您在操作上仍有任何疑問,歡迎留言交流,或加入:Google Analytics 4交流社團發問
Like (0)
發佈我的留言
取消留言
表情 贴图 加粗 删除线 居中 斜体

Hi,*为發佈留言必須填寫。

  • 顯示名稱*
  • 電子郵件地址*
  • 個人網站網址