GA4 電商追蹤完整設定，WooCommerce + GTM 追到 add_to_cart、begin_checkout、purchase
- 最後更新日期：
🚀 讀者專屬工具
立即開啟 →
在開始閱讀前，先用 AI 自動生成您的網站架構圖？
GA4 電商追蹤完整設定，WooCommerce + GTM 追到 add_to_cart、begin_checkout、purchase
你已經在投廣告，訂單也有在跑，但打開 GA4 卻只看到一堆 page_view？少了 GA4 電商追蹤 的事件與 items[]，就像只知道「有人進店」，卻不知道「拿了什麼、在哪一步放回去」。
這篇用 WooCommerce + GTM 把 view_item、add_to_cart、begin_checkout、purchase 一路追完整，而且每一步都能在 DebugView 驗證，最後能拿去做轉換、受眾與漏斗分析。
先把 GA4 與 GTM 的地基打穩，避免後面全部白工
如果 GA4 基本收不到資料，電商事件再完整也沒用。建議先用官方流程把 GA4 資料串流與 GTM 串起來，細節可對照這篇 GA4 安裝步驟與設定要點。
接著做一個最小驗證，你只要看到 GA4 的 DebugView 有事件流入，就能往下做電商。
| 目的 | 操作路徑 | 需要填的欄位 | 驗證方式 |
|---|---|---|---|
| 讓 GA4 先能收資料 | GTM, 新增「GA4 設定」或「Google tag」, 觸發 All Pages | 測量 ID G-XXXXXXX | GA4, DebugView 看到 page_view，GTM 預覽模式標籤有觸發 |
路線 A，用外掛輸出 dataLayer，最快把事件跑起來
想快速上線，做法是讓外掛把 WooCommerce 行為轉成 dataLayer.push()，GTM 只負責「接事件」和「送到 GA4」。常見作法是 GTM4WP 類型外掛，官方也有一份 GA4 電商設定流程可參考 GA4 Enhanced Ecommerce tracking 指南。
挑外掛時只看兩件事就夠：第一，事件名稱要能覆蓋 view_item、add_to_cart、begin_checkout、purchase；第二，ecommerce.items[] 是否符合 GA4 結構，至少要有 item_id 或 item_name，以及 price、quantity。
| 目的 | 操作路徑 | 需要填的欄位 | 驗證方式 |
|---|---|---|---|
| 讓外掛輸出 dataLayer 電商事件 | WordPress, 外掛, 安裝並啟用, 開啟電商 dataLayer | 開啟 GA4/Enhanced Ecommerce 選項(依外掛) | Chrome DevTools Console 輸入 dataLayer，確認有事件物件 |
| 讓 GTM 能抓到 items | GTM, 變數, 新增「資料層變數」 | 變數名稱 ecommerce.items、ecommerce.value、ecommerce.currency | GTM 預覽, Data Layer 分頁能看到對應值 |
| 對照外掛事件名稱 | GTM 預覽, 依序走產品頁, 加車, 結帳, 感謝頁 | 記下 dataLayer 的 event 值 | GA4 DebugView 看到對應事件，且事件參數有 items |
如果你用的是 GTM4WP 匯入容器類型流程，也可參考 GTM2WP + GA4 含電商追蹤教學，重點是匯入後仍要用 DebugView 檢查 items[] 是否完整。
路線 B，自行在主題或 Code Snippets 推送 dataLayer，掌控度最高
外掛追不到客製流程(套裝、加購、訂閱)，或你想要更乾淨的事件，就走自建。原則很簡單：WooCommerce 在「產品頁」「加入購物車」「結帳」「訂單完成」這些節點，把事件推到 dataLayer，GTM 再送 GA4。
最小可行範例概念如下(示意結構，不要省略 items[])：在前端執行 window.dataLayer=window.dataLayer||[]; dataLayer.push({event:'add_to_cart', ecommerce:{currency:'TWD', value:299, items:[{item_id:'SKU123', item_name:'商品A', price:299, quantity:1}]}});
實作時，產品資料建議由 PHP 輸出成 JSON，再給前端 push，避免你在 JS 另外打 API 造成延遲或抓錯價格。事件結構與 items 欄位細節，可對照這篇偏實戰的 GTM Data Layer 電商事件設定指南。
| 目的 | 操作路徑 | 需要填的欄位 | 驗證方式 |
|---|---|---|---|
| 在產品頁送出 view_item | 子主題 functions.php 或 Code Snippets, 於產品頁輸出商品 JSON | event:'view_item'，items[](item_id/item_name/price) | GTM 預覽, 進產品頁時 Data Layer 出現 view_item |
| 在加入購物車送出 add_to_cart | 監聽 add-to-cart 點擊(或 Woo hook 後輸出) | event:'add_to_cart'，value、currency、items[] | GA4 DebugView 事件參數有 items 且 quantity 正確 |
| 在感謝頁送出 purchase | WooCommerce thankyou 頁, 只在訂單存在時輸出 | transaction_id、value、currency、items[]，可加 shipping、tax、coupon | DebugView 的 purchase 展開後，確認 items 不是空陣列 |
GTM 事件標籤怎麼設，從 view_item 到 purchase 一次到位
GTM 這段的核心是三件事：先有 GA4 設定標籤(全站)，再做「自訂事件觸發器」，最後做「GA4 事件標籤」並把 ecommerce 參數帶上。若你的 dataLayer 結構符合 GA4，GA4 事件標籤可直接勾選「傳送電子商務資料」，減少手填參數出錯。
| GA4 事件 | 觸發條件(建議) | 主要參數(重點) |
|---|---|---|
| view_item | Custom Event 等於 view_item | items[] |
| add_to_cart | Custom Event 等於 add_to_cart | items[]，建議帶 value、currency |
| view_cart(可選) | Custom Event 等於 view_cart | items[] |
| begin_checkout | Custom Event 等於 begin_checkout | items[]，可帶 coupon |
| add_shipping_info(可選) | Custom Event 等於 add_shipping_info | shipping_tier、items[] |
| add_payment_info(可選) | Custom Event 等於 add_payment_info | payment_type、items[] |
| purchase | Custom Event 等於 purchase | 必填 transaction_id、value、currency、items[] |
purchase 建議一次就帶齊，這樣報表不會拆成碎片：shipping、tax、coupon 都能一起送。例如 coupon:'NEW100'，shipping:60，tax:15。驗證時在 GA4 DebugView 點 purchase 事件，重點看 items 是否有多筆商品，以及 value 是否等於訂單小計加運費加稅額的規則(依你店內定義一致就好)。
轉換也別忘了設：GA4 後台，管理，事件，把 purchase 標記為轉換。之後 Google Ads 要用轉換匯入才會穩。
去重一定要做，尤其感謝頁重整最常爆掉。做法務實一點：在 purchase dataLayer 帶 transaction_id，再用 GTM 加一個「只觸發一次」的保護(例如用自訂變數讀 localStorage 的 last_transaction_id，等於目前 transaction_id 就不送)。不去重，報表收入會被放大，後面每個決策都會歪。
金流回跳與跨網域也要顧：如果結帳會跳第三方網域，請在 GA4 的跨網域設定把支付網域加進去，並確認 GTM 的 Google tag 也有啟用跨網域連結器，避免使用者回到感謝頁被當成新來源，甚至買單事件丟失。
常見 10 個踩雷，幾乎都會讓營收報表變空白或變兩倍
- value/currency 不一致: 同一站別用 TWD 又送 USD，或 value 有時含運有時不含。
- items 缺 item_id: 沒 SKU 時至少要穩定的自訂 ID，不然商品維度很難用。
- event_name 用錯:
addToCart這種自創名稱，GA4 營利報表吃不到。 - 觸發條件太寬: 用 Page View 送 add_to_cart，事件會亂噴。
- purchase 重複送: 感謝頁重整，或金流回跳多次觸發。
- 測試污染正式資料: 測試訂單也送進同一串流，營收被稀釋。
- DebugView 看不到 items: 事件有進，但
items是空，等於沒追到商品。 - checkout 步驟缺事件: begin_checkout 有了，但付款方式與運送方式缺事件，漏斗會斷。
- 折扣只改 value 不帶 coupon: 想分析活動成效卻沒有 coupon 維度。
- 沒把 purchase 設轉換: 事件有收，廣告平台卻用不到。
結語
把 GA4 電商追蹤做到能在 DebugView 一筆一筆對得上，報表才會可信，廣告投放才會敢加碼。先選一條路線把 dataLayer 穩定輸出，再用 GTM 把事件送進 GA4，最後用去重與跨網域把漏洞補齊，purchase 才不會時有時無。想把 WooCommerce 電商追蹤一次做到可長期維護，也可以到 WPTOOLBEAR 交給熟悉 WordPress 的團隊協助落地與代管。
