聯絡我們LINE加入 LINEFacebook粉絲專頁
GTM教學|設定GA4事件大全
GTM

GTM教學|設定GA4事件大全

要如何知道客人進入首頁後,點過甚麼,選單列被點了幾次? 教你如何追蹤官網上的選單列、菜單列,並成功將事件傳送回GA4。

GA4要怎麼設定自訂事件? 如果網站要蓋GA4事件漏斗,或是GA4自訂事件、GA4自訂轉換事件,可以透過本篇文章使用GTM,完成GA4自訂事件的埋設。本篇範例透過追蹤網頁的選單列,當然你可以再將這個追蹤設定,延伸至其他網站上的事件設定。再埋設GA4自訂事件前,你需要先將 GA4與GTM串接 好,才有辦法做自訂事件的設定。

GTM後續可實施的追蹤事件。例如「撥打電話、加入社群、ICON圖示、網站指定按鈕、圖片」等GA4事件。這一篇的教學你只要有掌握,基本上都可以自行部署網站的GA4自訂事件。如果你要深入埋設全站事件,那你可能會需要學習「 GTM基礎教學|GTM如何使用DOM抓取表格的值|3分鐘學CSS Selector 」

要如何知道客人進入首頁後,點擊的事件或是選單列被點了幾次。 這一次的教學中,教你如何使用GTM追蹤官網上的選單列、菜單列,並成功將事件傳送回GA4。

直接透過GA4製作自訂事件,可以查看「 如何用GA4怎麼設定自訂事件| 無需使用GTM埋設 」。

收集完整名單型,包含驗證機制追蹤「 GTM教學 - WordPress表單驗證事件 - GA4追蹤教學 」。

如何依照產業規劃GA4事件漏斗

以下將常見的網站轉換事件大致分類,並寫出可行的事件規劃, 每個商業模式都不同,因此寫的事件、參數可能需要再做調整 。另外如果沒有你的產業別適用的事件漏斗規劃,也歡迎留言給我知道。

如果你的事件有包含「自訂參數」,那你可以透過這篇追蹤KOL的來源, 設定 GA4設定自訂參數 。

名單型

如果只是要名單型追蹤,可以查看這篇「 GTM基礎教學|名單型網站追蹤|Thankyou Page & 填寫表單事件 」。

這一篇講述不用驗證使用者「是否有完整」填寫表單的GA4事件。如果你想要追蹤「完整填寫的使用者」 那可以看 填寫表單提交按鈕 。

再來是你想要把填寫表單的資料做外傳,可以 使用CSS Selector將表單的值選取 ,並且回拋給GA4,但要注意有PII的資料無法,需要將資料導外,或是也可以做Google Ads的強化轉換。

**視不同網站,不同事件、參數

轉換事件:form_submit

微轉換事件:add_line, phone_call, social_icon, view_multi_pages, timer, form_start, scroll>50%

一般事件:Page_view, watch_video, view_search_result, File downloads,scroll<50%

私訊/電話/預約型

可以透過 追蹤網站的按鈕點擊來回傳至GA4 ,以便設定轉換事件,但有些產業並不適合這麼做,因為跨入第三方網域,後面使用者的行為都追蹤不了,因此在成效判斷,沒有辦法很明確地看出結果。如果你的私訊數、電話撥打想要設定轉換金額,那 你也可以透過放置Value讓GA4有對應的事件價值 。

假設平均10則私訊數,可以成功成交一筆20000元服務,那你的私訊平均金額就可以設定2000元。

轉換事件:message, phone_call, appointment, submit_application

微轉換事件:social_icon, view_multi_pages, timer, scroll>50%

一般事件:Page_view, watch_video, view_search_result, File downloads, scroll<50%

電商型

加入購物車、結帳頁面、購買事件。這三個算是電商必要的事件,需要搭配Google官方文件, 加上人員手動設定網站的DataLayer ,來返回GA4消費者購買的品項、品項ID、購買金額等資料。

如果你是想要製作微轉換 (潛在客戶),那你可以使用 計時器 、 點擊事件 、 或是部落格文章的追蹤 。透過GTM設定後,再把這些受眾設定至GA4,當作目標對象來投遞廣告。

轉換事件:add_to_cart. checkout, add_to_cart. begin_checkout, purchase

微轉換事件:add_to_cart. checkout,add_to_cart. begin_checkout, singup, scroll>50%, add_to_wishlist

一般事件:Page_view, watch_video, view_search_result

SAAS網頁應用服務

追蹤使用者註冊會員、使用者開始試用網站APP,如果你的事件想要有一定的轉換值 (幫助我們成效判斷),那你可以在GTM的事件參數帶Value,並給他一個動態變數, 動態變數需要透過前端語言抓取網站事件金額 。如果網站沒有事件金額,那你可以依照以下公式。

假設網站平均10個會員註冊,可以有1個成功付費訂閱,金額4000元,那你就可以把會員註冊傳送固定金額400元。其他轉換事件,或是微轉換事件也可以這樣利用。

轉換事件:complete_registration. subscribe, form_submit

微轉換事件:start_trial, signup, find_location. form_start, scroll>50%

埋設GA4自訂事件

此示範網站為Shopline建置,屬於電商型網站,但我個人認為如果是部落格、服務型網站,也適用這篇教學,如果你有掌握好GTM觸發條件的設定要領,以及CSS基礎語法,基本上全站90%都能自己完成設定。

查閱開發人員工具

進入開發人員模式,可以先釐清,這一類的按鈕是屬於Button型或Link型,有助於後續設定觸發條件,選取對的選項。圖片中的<a>標籤,因此可以判定為這是一個Link型的按鈕。如果不是<a>標籤,則視為Button型的按鈕,待會觸發條件會需要使用到。

學會查看前端開發者工具,是要學好GTM的一個必備功課,尤其 電子商務事件追蹤 ,也絕對會需要CSS selector的輔助。所以學好CSS選擇器是學好GTM網站事件追蹤的關鍵之一。

查看元素的變數製作觸發條件

這邊其實也可以判定,點選的選單類型為「Link Click」就知道待會的觸發條件該如何設定,中間選單中,我分別框起「Click Class, Click Elements」為我個人比較擅長且推薦用的追蹤條件。這邊為待會設定條件重要的參考內容之一。

可以先把「Click Class」-「navigation-menu-item-label」記住,待會觸發條件會需要,當然可以隨時回來看。通常有些人會使用Click Text做為追蹤,但如果有英文介面、或是其他網站變更,基本上GTM的觸發條件很容易失效,所以我個人會推薦 以「Click Class, Click Elements」做為追蹤優先選擇 。

新增GA4事件

事件名稱打上click_menu。事件參數你可以選擇設定也可以不用,看企業各自需求。再選擇剛剛設定的觸發條件。

觸發條件

利用剛剛我們得知的情報<a>,Link Click,所以我們條件類型選取「點擊-僅連結」,並將啟動時機,選取「Click Classes」包含「Navigation-Menu-Item-Label」。 **忘記原由的話,可以記得看一下Debug的圖面,了解我設定的邏輯。

完成事件設定

可以參照我的圖片,看看你的事件是否也是這樣設定,另外事件的參數,我個人習慣帶一個「Click Text」,記錄用戶點過的任何資訊,這樣我後續就可以在GA4隨時查看,如果不知道怎麼設定GA4自訂維度,也可以在這篇文章後閱覽。

確認有無成功觸發

點選預覽,進入Debug View,查看一下是否剛剛的代碼是否有成功Fired。

**TIP:如果你的代碼處於未觸發狀態,可以像我照片中範例這樣,打開它,查看哪一個條件不符合,再回去GTM首頁做修正,這樣就不會盲目亂修正了。如果想要知道如何快速解決錯誤,也可以查看這一篇「 Debug模式 - 快速查詢埋設到底哪裡有誤 。 」

完成並發布

等待24-72HRS,即可在GA4看到今天埋設的事件。很多人會 透過GA4直接設定事件 ,但我個人比較推薦統一使用GTM埋設;原因是未來方便管理代碼、交接給新人員的時候也好溝通、整理;當然還有Server也可以直接透過 GTM伺服器部署 。

如果你的轉換事件過了好幾天都沒有出現,你可以透過Debug模式檢查代碼有無正確觸發以外,也可以從 前端瀏覽器查看有無正確發送事件 ,基本上這邊是最準確的,只要瀏覽器有從前端發送,GA4的伺服器就會收到相對應的資料。

如何設定GA4的自訂維度

GTM除了可以設定GA4的自訂事件以外,同時也能設定GA4的自訂維度,自訂維度也會用於 電子商務事件的事件金額 、購買品項,這些都是透過GTM設定的事件參數來回傳給GA4。

要怎麼判別該設定事件or參數

我只能說這一題有很多種答案,有些人習慣把按鈕設定事件,因此網頁有非常多點擊按鈕的事件,後續再將名稱做好設定,後續來做分析。但 我習慣把「事件」劃分成大項目、「參數」劃分成小項目。

如果用GA4收集的邏輯來看,page_view底下的參數會有「page_location」、「page_title」、「referrer」等的小參數。依照這樣的設定邏輯,「發生了一個頁面瀏覽,瀏覽了那些頁面、哪些頁面標題、從哪裡推薦而來」。因此你的自訂事件可以仿照該邏輯,例如點擊按鈕,「點了哪些按鈕」、「按鈕的連結」、「在哪個頁面點擊」。

後續你可以打開自訂事件,就可以利用自訂參數的數量,來衡量分析該事件底下的參數多寡囉。

GTM 怎麼設定GA4自訂維度

例如上圖的click_text放置在GTM中自訂事件的參數。左邊為KEY值(查詢值),右邊為VALUE值。你需要將右邊換成對應的GTM變數,或者是將那一格放置常數。

再回去GA4設定中 => 自訂定義,設定自訂參數名稱,對應GTM的KEY值。

維度名稱:打上你要顯示的名稱,可以自訂名稱。 說明:打上這一格自訂維度的註解,方便人員了解它的作用。 事件參數:打上GTM設定的KEY值欄位名稱。

總結

利用GA4自訂事件漏斗,可以後續搭 配探索維度報表 ,來進行網站使用者的行為分析。如果想要看其他 GA4常見的問題 ,如何串接 BigQuery 、 not set、unassigned 等問題,那你可以到這篇文章查看。

需要任何協助嗎?

最快一個工作天將與您聯繫。

其他文章推薦

查看更多 →
【成功案例】修復GA4 網店總收益落差
成功案例

【成功案例】修復GA4 網店總收益落差

台灣開店平台常有數據與GA4 數據大幅落差問題。導致數據人員無法判讀數據的困擾。

【成功案例】修復GA4 網店工作階段判讀落差
成功案例

【成功案例】修復GA4 網店工作階段判讀落差

本次黑客修復網店utm 臉書廣告歸因判讀,以及direct / none 歸因判讀錯誤問題。成功將網店的臉書廣告歸因提升141% 正確修復,而direct / none 也有明顯下降!

Looker Studio |國外串接工具 Supermetrics, Adveronix 價格比較整理
Looker Studio

Looker Studio |國外串接工具 Supermetrics, Adveronix 價格比較整理

目前台灣要將臉書廣告數據、Google Ads、META 社群數據,或是GA4 數據彙整至Google Sheet, Looker Studio 都需要依賴以下這幾項工具 快客 、 Porter Metrics、Supermetrics、Reporting Ninja、Adveronix 與 Dataslayer.ai 。 如果你是正在尋找這種第三方串接工具的,這篇文章會很適合你,同時也可以考慮,由黑客數位所開發的串接工具 快客,價格合理、不限查詢次數、整合台灣常用資料源、全中文介面、中文客服支援 。本篇將深入比較五款熱門行銷報告與資料自動化工具 —— 快客 、Porter Metrics、S

Looker Studio 教學|Super Metrics 串接教學
Looker Studio

Looker Studio 教學|Super Metrics 串接教學

讓looker studio 串接臉書廣告數據。本篇文章使用supermetrics 帶你從0串接你的facebook ads 廣告數據。supermetrics 提供一個月999的台幣為授權使用費,也有提供免費使用的14天版本。

【成功案例】GTM 伺服器, Meta CAPI - GA4 完整導入
成功案例

【成功案例】GTM 伺服器, Meta CAPI - GA4 完整導入

本次黑客與台灣知名充電站品牌 EVOASIS 合作。提供部署GTM 伺服器追蹤、META CAPI設定、GA4 完整電商事件導入。黑客提供前後端完整技術支援,協助客戶蒐集到更準確的事件追蹤數據。

【成功案例】修正GA4 總收益數據落差
成功案例

【成功案例】修正GA4 總收益數據落差

本次黑客與勵馨基金會合作,GA4 修正顧問指導。從原本大幅捐款金額落差,網站只有蒐集到網站10%的金額數據。至透過黑客提供正確修正流程,網站收益金額提高到7-8成的數據正確。

【成功案例】內容型漏斗規劃
成功案例

【成功案例】內容型漏斗規劃

本次黑客與 UDRIVE City 合作,規劃 GA4 內容型網站漏斗事件。從原本完全沒有任何GA4 數據,完整揭露每一個網站用戶的行為節點。提高後續數據分析的完整性,加入購物車事件↑∞、購買事件↑∞。

【成功案例】多管道數據報表建置
成功案例

【成功案例】多管道數據報表建置

本次黑客與 古北町 合作,規劃 Looker Studio 多管道數據報表。結合 META廣告數據 x GOOGLE Ads 數據。整理、重新規劃原本凌亂難讀的數據報表,提供人員無需再手動整理數據、匯出Excel 數據等。提高後續數據分析的效率。

【成功案例】數據分析轉換率優化
成功案例

【成功案例】數據分析轉換率優化

本次黑客與 DEPIC 合作。Looker Studio, Clarity, AB TEST, GA4 工具。替客戶找出網站熱門動線、專注區域,以及透過數據判斷冗贅流程、商品頁過長、修正用戶購物流程等。打造多管道報表,有助於企業未來在數據分析時更加有效率。