GA4 電子商務 (gtag.js)：傳送通用 Analytics (分析) 事件

本指南說明如何使用現有的 gtag.js 通用 Analytics (分析) 電子商務導入設定，將電子商務事件傳送至 Google Analytics (分析) 4 資源。

如需其他遷移指南和資源，請前往開發人員遷移中心。

結果

本指南的結果是，您要使用現有的通用 Analytics (分析) 導入為新的 Google Analytics (分析) 4 資源填入資料。現有的通用 Analytics (分析) 導入將維持不變，通用 Analytics (分析) 電子商務報表會繼續填入資料，新的 Google Analytics (分析) 4 資源也會開始接收資料。

事前準備

  1. 請使用電子商務遷移輔助工具，確認以下程式碼是否說明您目前的導入方式：

    • 您正在使用通用 Analytics (分析) 資源
    • 您的網站使用 gtag.js 程式庫傳送電子商務事件

  2. 請參閱電子商務導入作業的遷移選項，瞭解各選項的優缺點。確認您是否想按照本指南，使用 Google Analytics (分析) 4 現有的 gtag.js 通用 Analytics (分析) 導入設定。

  3. 請參閱事件相容性參考資料，瞭解在傳送至 GA4 資源時，系統如何轉譯通用 Analytics (分析) 事件。

取捨與注意事項

請詳閱並考量下方資訊，全面瞭解搭配 Google Analytics (分析) 4 資源使用現有的 gtag.js (通用 Analytics (分析)) 電子商務導入設定會造成哪些影響。

優點 缺點
  • 由於您無法變更現有的電子商務事件代碼，因此導入最簡易的選項。
  • 可讓您在 GA4 和通用 Analytics (分析) 報表中查看電子商務資料。
  • 在通用 Analytics (分析) 資源中，電子商務資料的收集或記錄方式將維持不變。
  • GA4 無法辨識 select_content、checkout_progress、set_checkout_option 和 view_refund 事件，因此不會顯示在 GA4 電子商務報表中。
    • 在 GA4 中，系統會將上述事件及相關參數視為自訂事件和自訂參數。不過，系統不會將 items 參數的資料傳送至 Google Analytics (分析)，原因是該參數不支援自訂參數。
  • GA4「購物車詳細資料/Fallout 漏斗」報表中的「新增運送資訊」步驟將會空白。
  • GA4 商品/產品/項目清單漏斗報表中的「清單點擊次數」步驟為空白。
  • GA4 無法辨識類別的 / 分隔符號。 GA4 會將 cat1/cat2/cat3 回報為類別，而不是三個類別，例如 cat1、cat2 和 cat3。

導入作業

完成下列其中一個選項，即可使用現有的 gtag.js 通用 Analytics (分析) 導入設定，將電子商務事件傳送至 Google Analytics (分析) 4 資源。

方法 1：使用 GA4 設定輔助程式，並啟用已連結的網站代碼

GA4 設定輔助程式會自動建立新的 GA4 資源，並從通用 Analytics (分析) 資源複製下列設定：資源名稱、網站網址、時區和貨幣設定。這樣也可以啟用已連結的網站代碼功能，重複使用現有的通用 Analytics (分析) gtag.js 導入設定，以載入新的 GA4 資源。

按照「Google Analytics (分析) 4 設定輔助程式」一文所述的步驟，建立及設定新的 Google Analytics (分析) 4 資源。請務必勾選「允許使用現有代碼來收集資料」選項，以使用已連結的網站代碼功能。

方法 2：更新 gtag.js 程式碼片段

  1. 建立新的 Google Analytics (分析) 4 資源。
    • 使用 Google Analytics (分析) 4 設定輔助程式新增 Google Analytics (分析) 4 資源。 不過，在設定期間出現提示時，請取消勾選「Enable data collection with your existing tag」(使用現有代碼啟用資料收集) 選項。或者，您也可以在沒有 Google Analytics (分析) 4 設定輔助程式的情況下，建立 Google Analytics (分析) 4 資源。使用助理的好處是，可以複製通用 Analytics (分析) 資源中的部分基本設定。
  2. 找出 Google Analytics (分析) 4 資源的評估 ID。
  3. 使用 config 指令搭配評估 ID，在現有的 gtag.js 程式碼片段中加入 Google Analytics (分析) 4 資源。

以下 gtag.js 程式碼片段範例已設定通用 Analytics (分析) 和 Google Analytics (分析) 4 資源。

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXX-Y');         // Universal Analytics property.
  
  gtag('config', 'TAG_ID');  // Google Analytics 4 property.
  
</script>