Skip to content

GTM 如何正確的送出 GA4 網頁瀏覽事件?

如果你還沒有 Google Analytics 4 資源,可以前往 如何在網站與APP安裝新版 Google Analytics 4 資源 建立你的 GA4 資源。

在前一篇文章,我們提到了如何使用 GTM 建立 GA4 設定代碼,其中包含網頁瀏覽事件設定方式,在大部分的情況下,會使用預設開啟的載入這項設定時傳送一次網頁瀏覽事件選項,在設定代碼被觸發的同時自動送出一個網頁瀏覽事件。能夠自動為什麼要手動?本篇文章將會告訴你兩者之間的差異

載入這項設定時傳送一次網頁瀏覽事件

手動 vs 自動,兩者到底差在哪裡?

事實上,這一切都和時間有關,手動設定網頁瀏覽事件,可以自由控制在任何時間點觸發,自動送出的網頁瀏覽事件則會在網頁載入時觸發;到底該使用自動還是手動送出網頁瀏覽事件,可以透過下面兩個問題找到解答:

  1. 什麼時候應該送出網頁瀏覽事件?
  2. 網頁瀏覽事件包含了哪些參數和使用者屬性?

如果網頁瀏覽事件只會在每次網頁載入時觸發,且沒有使用任何參數和使用者屬性,那麼可以放心使用自動送出網頁瀏覽事件的功能即可。

什麼時候應該送出網頁瀏覽事件?

大多數情況,網站使用者瀏覽不同頁面時,會產生跳轉行為,網頁會從原本的網址導向新網址並重新載入,追蹤網頁瀏覽事件最好的做法就是在網頁載入時送出網頁瀏覽事件。

但是,如果你的網站是屬於單頁應用網站(Single Page Application 簡稱 SPA),事情就沒那麼簡單了,由於 SPA 網站是通過動態覆寫當前頁面內容,瀏覽不同頁面時網頁不會每次都重新載入;雖然對使用者體驗是好的,但網頁載入時觸發網頁瀏覽事件將不適用於這種狀況;所以,如果使用的是 SPA 類型網站,不要使用自動送出網頁瀏覽事件的功能

備註:如果是電子商務網站,可以注意一下,很多網站的結帳流程都是使用 SPA 架設,如果想將結帳流程之間的行為定義為不同頁面,可以同步參考下面的解決方式。

解決方案 – 使用 DataLayer 訊號送出網頁瀏覽事件

當網站使用 SPA 架構,最好的解決方式就是和網站工程師溝通,在頁面動態覆寫新頁面內容時(或任何你想定義為新的網頁瀏覽時機),送出網頁瀏覽訊號到 dataLayer(詳細說明可參考開發者文件):

dataLayer.push({'event': 'page_view'});

接下來就可以透過 GTM 自訂事件把這個訊號作為網頁瀏覽事件的觸發條件,詳細說明可以參考 GTM Data Layer 資料層 基礎介紹

GTM page view 自訂事件

網頁瀏覽事件包含了哪些參數和使用者屬性?

在先前的文章(Google Analytics 4 事件,你必須知道的4件事情),我們有提到過所有 GA4 事件都可以使用事件參數和使用者屬性收集額外資訊,這些額外資訊在後續的分析以及應用上可以提供很大的幫助,前提是我們要確保這些資訊能夠正常被收集。

確認所有參數和使用者屬性都可以在網頁瀏覽送出時被正常的讀取。在大多數情況下,使用的變數(參數或使用者屬性)會來自網站本身,例如頁面分類、文章編號等等,這些資訊要在網頁瀏覽送出時讀取並不會有什麼問題,但如果變數來自網站以外,常見的例如網站會員資料庫、廣告商訊號等等,就很有可能發生變數在網頁瀏覽之後才能取得,這時候如果強制送出網頁瀏覽事件,因為變數值為空(還沒收到資訊),網頁瀏覽事件將收不到任何參數或使用者屬性資訊;更詳細的說明可以參考 GTM 發送 GA User-ID 追蹤訊號 的案例。

解決方案 – 使用 DataLayer 訊號送出網頁瀏覽事件

當使用的變數來自網站外部,因為無法保證變數值什麼時候會回傳到網站,使用內建觸發條件就會相對的危險(例如網頁瀏覽、DOM 就緒、視窗以載入等等);最好的解決方式就是和網站工程師溝通,在變數回傳到網站時將,資訊送到 DataLayer,並送出網頁瀏覽訊號(詳細說明可參考開發者文件):

dataLayer.push({
	'event': 'page_view',
	'參數範例': 'xxxx',
	'使用者屬性範例': 'xxxxx'
		});

注意:這邊一定要將名稱定義為網頁瀏覽(‘event’: ‘page_view’),如果沒有特別宣告名稱,後續將無法判別出該網頁瀏覽訊號。

接下來就可以透過 GTM 自訂事件把這個訊號作為網頁瀏覽事件的觸發條件,詳細說明可以參考 GTM Data Layer 資料層 基礎介紹

ga4 網頁瀏覽

手動新增網頁瀏覽事件

如果你打算手動新增網頁瀏覽事件,不管是因為上面提到的哪一個原因,你都應該已經按照上述說明取得訊號並建立好網頁瀏覽觸發條件,接下來將會一步一步教你如何正確的新增 GA4 網頁瀏覽事件代碼。

1. 關閉自動發送網頁瀏覽事件選項

確實關閉(取消打勾)自動發送的選項,避免重複發送網頁瀏覽事件。

Step1: 關閉自動發送網頁瀏覽事件選項

2. 新增 GA4 事件代碼

Step2: 新增 GA4 事件代碼

3. 正確的命名網頁瀏覽事件

網頁瀏覽事件名稱一定要使用規定的名稱(page_view),這麼做除了能夠收集額外自動收集參數,還可以啟用網頁瀏覽相關的報表,詳細說明可以參考官方文件

Step3: 正確的命名網頁瀏覽事件

4. 新增參數和使用者屬性

填入欲使用的參數和使用者屬性,雖然 GA4 會繼承設定代碼的參數和使用者屬性配置,但要注意設定代碼的參數不會即時更新,詳細說明可以參考 GA4 事件代碼說明

Step4: 新增參數和使用者屬性

5. 設定觸發條件

將先前建立的網頁瀏覽自訂事件當作代碼觸發條件。

Step5: 設定觸發條件

6. 檢查並發布代碼

使用 GTM 預覽模式,檢查網頁瀏覽事件是否能夠正常的被觸發,使用的事件參數和使用者屬性也收的到正確的值,確認無誤後即可發布新的 GTM 版本。

Step6: 檢查並發布代碼
數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

數據顧問服務

數據酷顧問團隊
提供企業專屬的數據解決方案

文章許願池

想看什麼文章主題?
我們會儘快為您安排

Scroll To Top