【實作教學】新版 GA4 電子商務事件，新舊差異與 purchase 轉換！

· GA4P

新版 GA4 的電子商務事件跟通用型 GA 有著不少的差異性，本篇文章會帶你一次搞清楚新版與舊版在「事件名稱」與「參數名稱」差異；還有新版 GA4 的參數支援了哪些事件；最後會利用 Google Tag Manager 實作教學，帶你實際完成一次 GA4 電子商務購買事件的佈署流程。

文章目錄

一、新舊版 GA 電子商務事件差異

　１. 事件名稱上的差異

　２. 參數名稱上的差異

　３. 新版 GA4 電子商務參數支援事件說明

二、新版 GA4 電子商務事件實作教學

　１. 啟動網站的 Debuge Mode

　２. 確認網站的 Data Layer 資訊

　３. 串接 GA4 跟 GTM

　４. 在 GTM 設定電子商務事件轉換的觸發條件

　５. 在 GTM 設定電子商務事件轉換的代碼＆變數

　６. 利用 GA4 的 Debug View 預覽埋設是否正確

一、新舊版 GA 電子商務差異

這篇文章將帶給讀者三個簡單的概念：

１. 事件名稱上的差異

【電子商務報表的資源如何出現的】

想要使用新版 GA4 的電子商務報表，需要從網站將資料回傳到後台，並且是回傳系統可以辨識的資料格式，系統才能呈現在電子商務報表上面，這邊就列出了新版與舊版 GA 在電子商務事件行為名稱上的差異供讀者參考。

請注意：

並不是所有的結帳行為資訊都需要紀錄，例如「add_shipping_info」以及「add_payment_info」這兩個行為對於金融性商品就不是必要資訊，記得針對實際的消費者購物流程去調整。

２. 參數名稱上的差異

【 GA 是怎麼知道我到底賣了什麼商品】

想要詳細追蹤商品在網站或是應用程式銷售的狀況，你需要在購買行為發生的時候同時把商品的銷售資訊一起回傳到 GA4 的後台上。

例如：你的網站販售了一個杯子。你必須要提供「產品的 ID」、「產品售價」、「產品說明」、「產品銷售數字」... 等資訊給 GA，電子商務報表才能夠呈現出銷售狀況，你也能夠進一步去評估銷售的表現。

這邊也列出了新版與舊版 GA 在電子商務事件參數名稱上的差異供讀者參考。

你會發現新版 GA4 做了不少名稱上的調整，將商品或服務的代號統一調整成「item」，並且在後面加上「 _ 」去代表不同的資訊，同時也針對廣告的新增了一些之前沒有的參數，例如「promotion_id」（促銷訊息 ID）。

３. 新版 GA4 電子商務支援事件說明

【一個事件參數可以支援多種事件】

我們都知道事件是由名稱與參數組成，因此一個參數可能會同時支援多個事件，例如「tax（稅）」就會跟「購買事件」、「退貨事件」這兩種事件有關，因此官方也提供了電子商務的事件參數支援了哪些事件。

Google Analytics 4 Property 電子商務事件行為參數支援表

請注意：

假如你想要追蹤的參數跟事件都不在官方文件上面也不用擔心，你可以自行設定事件以及維度、指標，只是因為名稱跟參數都是自己設定，所以未來可能會不適用某些報表功能。

二、新版 GA4 電子商務事件實作教學

最後我們將透過 GTM 實際帶大家實作一次電子商務事件的追蹤，以購買事件為例。

請注意：

請確認網站已經導入了電子商務的 Data Layer 的資訊，假如網站原本就有通用型 GA 加強型電子商務的 Data Layer 資訊，可以沿用，不知道的建議先跟工程師或是網站建置商確認，需要埋設的資訊可以參考 Google Tag Manager 提供的開發者文件。

【 Step 1 】啟動網站的 Debug Mode

進入 { Tag Assistant }，點擊新增網域，輸入網站網址。

啟動完成，點擊持續。

回到 { 你的網站 } 啟用右下角的 Debugger connected 視窗。

【 Step 2 】確認網站的 Data Layer 資訊

在 { 你的網站 } 實際完成一次購物流程。

在 { Tag Assistant } 找到 Purchase 的事件，點到 Data Layer 的頁籤。

在 Data Layer 找到符合 GA4 電子商務事件的參數。

【 Step 3 】串接 GA4 跟 GTM

串接 Google Analytics 4 Porperty 跟 Google Tag Manager

在 { Google Analytics } 點擊左下角齒輪 -> 選擇資料串流 -> 選擇你的網站，找到評估 ID。

複製評估 ID。

進入 { Google Tag Manager } 的代碼頁面，點擊新增。

新增一個「串接 GA4 跟 GTM」的代碼：

・編輯名稱：可以辨識的。
・代碼類型：GA4 設定。

・評估ＩＤ：GA4 複製的評估 ID。
・觸發條件：All Pages。

在代碼頁面看到設定完成的代碼。

【 Step 4 】在 GTM 設定電子商務轉換的觸發條件

在 { Tag Assistant } 確認要從 Data Layer 送的事件名稱。

設定傳送電子商務轉換事件的觸發條件：

・編輯名稱：自訂事件 - 購買。

・類型選擇：自訂事件。

・事件名稱：purchase。

設定完畢按下儲存。

觸發條件設定完成。

【 Step 5 】在 GTM 設定電子商務轉換的代碼＆變數

進入代碼頁面，點擊新增代碼。

設定傳送電子商務轉換事件的代碼：

・編輯名稱：可以辨識的。

・代碼類型：GA4 事件。

・設定代碼：使用【 Step 3 】設定的代碼。

・事件名稱：需要確認送出的資料格式符合規範。

在 { Tag Assistant } 確認 { Google Tag Manager } 送出的資料格式 Event = Purchase，符合 { Google Analytics } 的規範。

設定傳送電子商務轉換事件的代碼：

・事件參數：在 { Google Analytics } 收集的事件，包含什麼參數。

在 { Tag Assistant } 裡面找出 purchase 事件的 Data Layer 可以看到一共有 7 個事件參數可以傳送到 { Google Analytics }，我們這邊會實際設定三個當作範例給各位參考。

回到 { Google Tag Manager } 輸入第一個參數名稱 transaction_id，並且點擊「值」的按鈕。

點擊新增變數。

設定傳送電子商務轉換事件參數的變數：

・編輯名稱：命名方式建議為 div - ....。

・資料類型：資料層變數。

・資料層變數名稱：需要確認資料的路徑。

・資料層版本：版本 2。

你可以在在 { Tag Assistant } 找到 purchase 事件的 Data Layer 確認路徑。

請注意！

在設定事件參數的時候，只有 item 的資料層版本要選擇版本１，不然系統會出現錯誤。

七個事件參數都設定完畢之後，設定傳送電子商務轉換事件的代碼：

・觸發條件：使用【 Step 4 】設定的觸發條件。

在代碼頁面看到設定完成的兩個代碼。

【 Step 6 】利用 GA4 的 Debug View 預覽埋設是否正確

在 { Google Tag Manager } 點擊預覽。

再度完成一次購買流程，可以在 { Tag Assistant } 看到購買行為時 { Google Tag Manager } 觸發了一個資料傳到 { Google Analytics }。

回到 { Google Analytics } 選擇 Debug View 報表，可以看到 purchase 事件，點擊一下。

可以在裡面看到剛剛設定要追蹤的電子商務事件參數。

點擊項目頁籤，商品的資訊。

在所有事件報表裡面可以看到 purchase 被直接設為轉換。

【假如系列談】

假如我全部的電子商務行為事件都埋設完會怎麼樣 ... ？

如果你有埋設完所有的電子商務行為事件，就能夠在電子商務報表完整看到購物的步驟與流程，包含項目瀏覽量、加入購物車次數、觀看後加入購物車率、商品購買數量、商品收益 ... 等各項指標；如果你在埋設的過程當中碰到問題，或是不知道該如何埋設程式代碼，歡迎填寫【詢問表單】 或是直接在右下角 【私訊我們】，我們隨時都有分析師在線上協助支援，請不要客氣！大膽地提出你的問題！