如何用 GTM 設定 GA4 「內容群組」維度?

曾經使用過 GA3 的朋友一定會知道報表中有個很好用的「內容分組」維度,可以將相關的網頁打包成一個組別,並透過一個報表一目了然的分組閱讀數據,過往這個功能可以透過 GA3 的後台設定,到了 GA4 之後卻發現,雖然這個維度還在,改名為「內容群組(content group)」,但是卻無法透過 GA4 後台進行設定了,如果在報表中選擇這個維度,我們只會看到 (not set)。

這篇文章就是要告訴你,如何透過 GTM 設定,讓我們可以在 GA4 中善用「內容群組」維度。

在這篇文章中,我們會介紹兩個方法,第一個方法不需要工程師協助,但是會受限於網站網址結構,第二個方法則需要工程師幫忙,因為會運用到資料層的觀念。

如果你已經很熟悉 GA4 「內容群組」的維度概念,就不需要閱讀接下來的維度介紹,可以直接跳到 GTM 設定方式的段落。



什麼是內容群組?

在觀看 GA 報表的時候,你會注意到隨著網站越來越大,頁數越來越多,預設報表如果沒有經過篩選會變得很肥很長(如下圖,就有 1,154 列的頁面)。

假設今天老闆問說:「我們哪個類別的頁面或是產品最多人看?最多轉換?」

你可能就無法馬上從這樣的報表中找到解答,回答老闆的問題。

對於上述情況,你可以這麼做:

  1. 建立一個探索報表,透過篩選的方式將不同類別網頁進行分組,讓單一報表只顯示與該類別相關的網頁。
  2. 善用「內容群組」維度,未來只要選擇「內容群組」作為主要維度,就能獲得你要的答案。

而在還沒有設定「內容群組」之前,如果在 GA4網頁和畫面報表選擇這個維度的話,你只會看到 (not set)。

接下來我們要做的是,透過 GTM 的設定將網站頁面進行打包分組,就可以使用「內容群組」維度,幫助你一目瞭然網站不同頁面群組的成效表現。

例如:你的網站有以下這幾個介紹 GA4、GTM 以及 SEO 的文章頁面

透過設定將其打包之後,就會變成像是下圖的概念,可以整合所有的數據在同一個維度上觀察(其實就是將篩選的結果,整合到同一維度上),一目了然所有的指標。

「內容群組」PV 的顯示會整合同類網頁的 PV

當然也可以放入需要觀察的次要維度,這樣整個報表就不會落落長,以報表閱讀性來說也會相當好懂易讀,如同下圖。


如何用 GTM 設定內容群組?

假設今天網站網址結構完整,網址組成是:https://主網域/目錄/文章標題,以 MKTGholic 的網站來說,我們將文章分成了幾個類別,分別介紹 GTM、GA4 以及 SEO,而每篇文章的網址結構如下:

https://mktgholic.com/google-tag-manager/gtm-with-ga4-and-meta-pixel/
https://mktgholic.com/google-analytic-4/ga4-dashboard-and-report-overview/

https://mktgholic.com/seo/seo-overview/

可以看到網址結構組成是:https://主網域/目錄/文章標題,每篇跟 GTM 相關的文章網址一定會帶有「/google-tag-manager/」,而跟 GA4 相關的文章則是帶有「/google-analytic-4/」。

這樣我們就可以透過 GTM 的變數類型:規則運算式對照表搭配網址變數來進行設定,將網址帶有同樣目錄名稱的文章,打包成一個群組。

使用「規則運算式表格」+「網址」變數

(接下來的教學步驟,是假設你的網站已經設定好了 GA4 追蹤代碼,如果還沒設定好的朋友,可以參考這篇文章:「如何用 GTM 安裝 GA4 評估 ID」)

首先來到 GTM 的「變數」頁面 > 下方「使用者定義的變數」區塊 > 點選右上角「新增」> 選擇「規則運算式表格」

  1. 輸入變數的部分,下拉選單選擇「Page URL」(如下圖)
  2. 左邊欄位填入網址的目錄段,如:/google-tag-manager/,記得以規則運算式的方式填入,會變成 \/google-tag-manager\/
  3. 右邊欄位填入相對應輸出的值。
  4. 設定預設值,如果頁面沒有符合規則,給予預設的群組名稱。
  5. 記得忽略大小寫,不用完全相符,否則就會去比對到整串 URL。

這邊在做的就是:

當使用者來到了網頁,就去比對該頁的 URL,如果 URL 裡面包含符合左邊欄位的名稱,就輸出相對應的值,也就是我們的群組名稱。

例如:
當網址內有 /google-tag-manager/ 時,群組名稱就為 GTM
當網址內有 /google-analytic-4/ 時,群組名稱就為 GA4
當網址內有 /search-engine-optimization/ 時,群組名稱就為 SEO
當比對不到時候,群組名稱就為 Other Pages

將變數與 GA4 追蹤代碼綁定

變數設定完畢之後,來到 GTM 的代碼介面,找到 GA4 追蹤代碼,將剛剛設定的變數放到追蹤代碼的配置設定中,配置參數名稱欄位打上「content_group」這邊名稱要完全ㄧ樣,此為 GA4 預設的參數,我們在這邊做的是將其參數覆蓋,以顯示我們想要的內容群組名稱。

當 GA4 追蹤代碼在每個頁面啟動時,會依照上面所設定的「規則運算式表格變數」規則,判斷當前頁面 URL 是否與規則相符,如果相符,就會送出相對應的值。

搞定!進行確認

在 GA4 的代碼設定中新增參數設定之後,來到 GTM 預覽模式確認是否有送入正確的參數值。

下圖可以看到當我們所在位置為首頁時,因都不符合「規則運算式對照表變數」中的條件,所以給予預設的「Other Pages」 作為群組名稱。

目前位置:網站首頁

來到 GA4 即時報表做進一步確認,可以看到 GA4 確實收到了名為「content_group」的參數。

DebugView 當中也可以看到參數「content_group」,大功告成,接下來回到 GTM 提交代碼就完成這部分的設定了。


使用「資料層變數」

如果今天很不幸的,網站的網址結構並不如上述的那麼規則無法讓你透過網址分類內容群組,不用擔心,依然是有辦法處理,只是要請工程師幫個小忙,請他們在網站中放入以下代碼,將所需的資料推送到網站的資料層(Data Layer)當中

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  'page_group' : '當前頁面所屬分類'
});

(如果是第一次造訪本站,對於資料層還不甚熟悉,可以先看這篇文章:「Data Layer 資料層是什麼?」)

在上面的代碼中,「page_group」 可以替換成任何你想要的命名,「當前頁面所屬分類」則替換成文章目錄或是產品大項分類,如果延續上一段的範例,可能就是:GA4、GTM、SEO 以及 Other Pages。

因此會變成:
GA4 相關內容的頁面,推送 ‘page_group’ : ‘GA4’ 到資料層
GTM 相關內容的頁面,推送 ‘page_group’ : ‘GTM’ 到資料層
SEO 相關內容的頁面,推送 ‘page_group’ : ‘SEO’ 到資料層

工程師設定完畢之後,我們可以先透過預覽模式檢查 Data Layer 中是否有我們要的資訊,你會在預覽模式左側面板看到一個「Message」字樣(通常會在 Consent Initialization 同意聲明初始化之前),點選之後看到右側面板會出現我們給工程師推送的代碼。

確認沒問題之後,就可以透過 GTM 來抓取這邊的參數。

新增「資料層變數」

接著,來到 GTM 變數介面中新增「資料層變數」,抓取請工程師推送的資料層參數,再將這個參數放到 GA4 參數配置中,流程基本上都跟上一段ㄧ樣,唯一不同的是我們在變數類型中使用的是「資料層變數」

這邊就不需要像是前一段的設定這麼麻煩一個一個輸入需要對照的「網址」「值」,因為工程師都已經幫你處理好並將所需的變數放到資料層當中,只需要注意在「資料層變數名稱」的欄位中,必須要跟資料層中的名稱(page_group)完全一樣,才能抓得到相對應的值。

「資料層變數」設定完畢之後,依循之前的步驟,將其放入 GA4 追蹤代碼,接著再用 GTM 預覽、GA4 即時報表以及 DebugView 測試並確認一遍即可。


總結

簡單幾個步驟,就可以完成 GA4 內容群組的設定,不管是透過網址變數或是資料層的變數,都可以幫助我們未來在製作 GA4 的報表時,使用「內容群組」維度。

老闆或是客戶時間寶貴,不見得可以一頁一頁慢慢看,如果能夠先利用「內容群組」維度發現流量的驟升或驟降,再深入去找尋原因,相信也會節省彼此許多時間。

如果對於 GA4 還不甚熟悉的朋友,可以參考這篇介紹 GA4 前台介面的文章,幫助你有個全觀,了解 GA4 可以帶給你什麼協助。

如果沒有 GA4 帳號也沒關係,可以透過這篇文章我們手把手帶你建立 GA4 帳號並且認識後台,或是你可以使用 Google 提供的示範帳戶,都是幫助你上手 GA4 的好工具。


延伸閱讀

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

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