← All articles

How to Set Up GA4 Ecommerce Tracking in Google Tag Manager

April 1, 2026

GA4 ecommerce tracking gives you a full picture of how shoppers interact with your store: which products they view, what they add to their carts, and what they ultimately buy. Without it, your GA4 reports show page views and sessions but nothing about revenue, product performance, or checkout drop-off.

The setup is more involved than basic event tracking because ecommerce events require structured product data in the data layer. This guide walks through every step: the event names GA4 expects, data layer structure, GTM tag configuration, platform-specific setup for Shopify and WooCommerce, and testing.

What are the GA4 ecommerce events?

GA4 defines a specific set of ecommerce event names. Using these exact names is mandatory — they unlock GA4's built-in Monetization reports, purchase funnels, and predictive audiences. Custom event names will not populate ecommerce reports.

Event Name	When to Fire	Required Parameters
view_item_list	User sees a product list (category page, search results)	items
select_item	User clicks a product from a list	items
view_item	User views a product detail page	items, currency, value
add_to_cart	User adds a product to the cart	items, currency, value
remove_from_cart	User removes a product from the cart	items, currency, value
view_cart	User views the shopping cart	items, currency, value
begin_checkout	User starts the checkout process	items, currency, value
add_payment_info	User submits payment information	items, currency, value
add_shipping_info	User submits shipping information	items, currency, value
purchase	User completes a transaction	items, transaction_id, currency, value
refund	A refund is issued	items, transaction_id, currency, value

You do not need to implement every event on day one. Start with the core funnel: view_item, add_to_cart, begin_checkout, and purchase. Add view_item_list and select_item once the basics are working.

How does the GA4 ecommerce data layer work?

GA4 ecommerce events rely on a specific data layer structure. Every ecommerce push must include the event name and an ecommerce object containing an items array. Each item in the array represents one product.

Here is the standard structure:

dataLayer.push({ ecommerce: null }); // Clear previous ecommerce data
dataLayer.push({
  event: "view_item",
  ecommerce: {
    currency: "USD",
    value: 29.99,
    items: [
      {
        item_id: "SKU-12345",
        item_name: "Blue Running Shoes",
        item_brand: "SportBrand",
        item_category: "Footwear",
        item_category2: "Running",
        item_variant: "Blue / Size 10",
        price: 29.99,
        quantity: 1,
        index: 0,
        item_list_id: "related_products",
        item_list_name: "Related Products"
      }
    ]
  }
});

Critical rule: always clear the ecommerce object before pushing a new event. The line dataLayer.push({ ecommerce: null }) prevents stale product data from one event bleeding into the next. Without this, GTM may merge old and new ecommerce objects, sending incorrect product data to GA4.

The items array supports up to 200 products per event. Each item has standard fields:

• item_id — product SKU or unique identifier (required)
• item_name — human-readable product name (required)
• price — unit price as a number, not a string
• quantity — number of units
• item_brand, item_category, item_variant — optional but valuable for GA4 reports
• item_category2 through item_category5 — nested category hierarchy
• index — position of the product in a list (for view_item_list and select_item)

How do I push product data to the data layer?

The data layer push must happen on your website, not in GTM. Your site's backend or frontend code is responsible for injecting the correct product data at the right moment. GTM only reads from the data layer — it does not generate product data.

There are three common approaches:

1. Server-side rendering. Your CMS or backend template injects a <script> block with the dataLayer.push() call on page load. This is the most reliable method for view_item and view_item_list events because the data is available before GTM loads.
2. JavaScript event listeners. For user-initiated actions like add_to_cart, attach a click event listener to the "Add to Cart" button that extracts product data from the DOM and pushes it to the data layer. This requires access to the site's JavaScript.
3. Platform plugins. Shopify, WooCommerce, Magento, and other platforms have plugins that handle data layer pushes automatically. These are covered in the platform-specific sections below.

If you cannot modify the website's source code, you can use a GTM Custom HTML tag to extract product data from the page DOM. This approach is fragile — it depends on the HTML structure staying consistent — but it works as a last resort. GTM Event Helper's AI Agent uses this approach intelligently: it analyzes the page structure and generates extraction scripts that dynamically read product data from DOM elements rather than hardcoding values.

How do I create GA4 ecommerce tags in GTM?

Each ecommerce event needs its own GA4 Event tag in GTM. The key difference from regular GA4 events: you must enable the "Send Ecommerce Data" checkbox, which tells the tag to read the ecommerce object from the data layer automatically.

Step-by-step for each tag:

1. In GTM, go to Tags → New
2. Tag Type: Google Analytics: GA4 Event
3. Measurement ID: Your G-XXXXXXXXXX
4. Event Name: The exact GA4 ecommerce event name (e.g., view_item, add_to_cart, purchase)
5. Expand More Settings → Ecommerce and check "Send Ecommerce data". Select "Data Layer" as the data source.
6. Trigger: Create a Custom Event trigger where the event name matches the data layer push (e.g., Event Name equals view_item)

You do not need to manually map item parameters — the "Send Ecommerce data" option reads the entire ecommerce.items array automatically. You only need to add extra event parameters if you want to send additional data beyond what the ecommerce object contains.

How do I set up view_item and view_item_list events?

view_item fires on product detail pages. view_item_list fires on category pages, search results, or any page displaying multiple products.

view_item data layer push:

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_item",
  ecommerce: {
    currency: "USD",
    value: 49.99,
    items: [{
      item_id: "SKU-789",
      item_name: "Wireless Headphones",
      item_brand: "AudioTech",
      item_category: "Electronics",
      item_category2: "Audio",
      price: 49.99,
      quantity: 1
    }]
  }
});

view_item_list data layer push:

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "view_item_list",
  ecommerce: {
    item_list_id: "category_electronics",
    item_list_name: "Electronics",
    items: [
      {
        item_id: "SKU-789",
        item_name: "Wireless Headphones",
        price: 49.99,
        index: 0,
        item_list_id: "category_electronics",
        item_list_name: "Electronics"
      },
      {
        item_id: "SKU-790",
        item_name: "Bluetooth Speaker",
        price: 34.99,
        index: 1,
        item_list_id: "category_electronics",
        item_list_name: "Electronics"
      }
    ]
  }
});

The index field tells GA4 the position of each product in the list. This powers the "Product List Performance" report in GA4, showing which list positions drive the most clicks and revenue.

In GTM, create two tags: one for view_item and one for view_item_list. Both use the same configuration — GA4 Event tag with "Send Ecommerce data" enabled — but different Custom Event triggers.

How do I set up add_to_cart and remove_from_cart events?

These events track when users modify their cart. The data layer push fires when the user clicks "Add to Cart" or "Remove" on a cart item.

add_to_cart data layer push:

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "add_to_cart",
  ecommerce: {
    currency: "USD",
    value: 49.99,
    items: [{
      item_id: "SKU-789",
      item_name: "Wireless Headphones",
      item_brand: "AudioTech",
      item_category: "Electronics",
      price: 49.99,
      quantity: 1
    }]
  }
});

remove_from_cart uses the identical structure — just change the event name to remove_from_cart.

Common pitfalls with cart events:

• Quantity mismatches. If the user adds 3 units, the quantity field should be 3, not 1. The value should reflect the total: price * quantity.
• Missing currency. GA4 ignores monetary values without a currency field. Always include it.
• Firing on page load. Cart events should fire on user action (click), not on page load. If your site reloads the page after adding to cart, fire the event on the confirmation page or use a cookie/sessionStorage flag to push the event once.

How do I set up the purchase event?

The purchase event is the most critical ecommerce event. It populates GA4's revenue reports, conversion data, and feeds into Google Ads Smart Bidding. A misconfigured purchase event means inaccurate revenue data across your entire analytics stack.

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: "purchase",
  ecommerce: {
    transaction_id: "T-20260401-001",
    currency: "USD",
    value: 109.97,
    tax: 8.80,
    shipping: 5.99,
    coupon: "SPRING20",
    items: [
      {
        item_id: "SKU-789",
        item_name: "Wireless Headphones",
        item_brand: "AudioTech",
        item_category: "Electronics",
        price: 49.99,
        quantity: 2,
        coupon: "SPRING20"
      },
      {
        item_id: "SKU-456",
        item_name: "USB-C Cable",
        item_category: "Accessories",
        price: 9.99,
        quantity: 1
      }
    ]
  }
});

Key requirements for the purchase event:

• transaction_id is mandatory. GA4 uses it to deduplicate transactions. Without it, refreshing the thank-you page sends duplicate purchases.
• value must match your actual revenue. It should be the order subtotal (sum of price * quantity for all items). Whether you include tax and shipping in value depends on your business — just be consistent.
• currency must be a valid ISO 4217 code (USD, EUR, GBP, etc.).
• Fire only once per transaction. Use the order confirmation page (thank-you page) and ensure the data layer push does not fire on page refresh. Server-side rendering with a one-time flag is the safest approach.

In GTM, the purchase tag is identical to other ecommerce tags: GA4 Event tag, event name purchase, "Send Ecommerce data" enabled, triggered by a Custom Event where event name equals purchase.

How do I test ecommerce tracking in GA4 DebugView?

Testing ecommerce events is more involved than testing basic events because you need to verify the items array, not just the event name.

1. Enable GTM Preview mode. In GTM, click Preview and connect to your site.
2. Navigate through the purchase funnel. View a product, add to cart, proceed to checkout, complete a purchase (use a test order).
3. Check Tag Assistant. For each step, verify the correct GA4 Event tag fired. Click the tag to inspect the event — look for the ecommerce object and confirm the items array contains the right products, prices, and quantities.
4. Open GA4 DebugView. Go to GA4 Admin → DebugView. Enable debug mode with the GA Debugger extension or by adding ?debug_mode=true to your URL.
5. Inspect each event. Click on each ecommerce event in the DebugView timeline. Expand the event parameters and verify:
   • The items array has the correct number of products
   • Each item has item_id, item_name, and price
   • currency and value are present and correct
   • For purchase: transaction_id is unique

Common DebugView issues:

• Event appears but items array is empty. The "Send Ecommerce data" checkbox is not enabled in the GTM tag, or the data layer push uses an incorrect structure (e.g., products instead of items).
• Items show but price is 0 or missing. The price field is a string ("29.99") instead of a number (29.99), or it is nested incorrectly.
• Event does not appear at all. The Custom Event trigger name does not match the data layer push event name. Check for typos and case sensitivity — add_to_cart is not addToCart.

How do I set up ecommerce tracking on Shopify?

Shopify does not natively push GA4-compatible data layer events. You need a third-party solution or custom code. Here are the common approaches:

1. Shopify's native GA4 integration (limited). Shopify offers a built-in Google channel that sends ecommerce data directly to GA4 without GTM. It covers basic events (view_item, add_to_cart, purchase) but gives you no control over parameters and does not work with GTM.
2. GTM + data layer app. Apps like "Google Tag Manager for Shopify" (by Elevar, Analyzify, or GTM4WP equivalents) inject data layer pushes for all ecommerce events. This is the recommended approach because it gives you full control in GTM.
3. Custom Liquid code. If you prefer not to use an app, you can add data layer pushes directly in Shopify's theme Liquid templates. This requires modifying theme.liquid, product.liquid, and the checkout via Shopify's Additional Scripts (for purchase events). This is powerful but harder to maintain across theme updates.

Regardless of approach, the GTM configuration stays the same: GA4 Event tags with "Send Ecommerce data" enabled, fired by Custom Event triggers matching the data layer event names.

Shopify checkout limitation: Shopify restricts JavaScript on checkout pages for stores not on Shopify Plus. For non-Plus stores, purchase tracking typically uses Shopify's Additional Scripts field in Settings → Checkout, which runs on the order confirmation page.

How do I set up ecommerce tracking on WooCommerce?

WooCommerce has stronger GTM integration thanks to the open-source ecosystem. The standard approach:

1. Install a data layer plugin. "GTM4WP" (GTM for WordPress) by Thomas Geiger is the most popular free option. It pushes GA4-compatible data layer events for all standard ecommerce actions automatically.
2. Configure GTM4WP settings. After installation, go to Settings → Google Tag Manager → Integration tab and enable "WooCommerce" integration. Select the data layer format: choose "GA4" (not "Universal Analytics").
3. Create GTM tags. GTM4WP pushes events with standard GA4 names, so your GTM setup is the same as described earlier. Create a GA4 Event tag per event with "Send Ecommerce data" enabled.

GTM4WP handles the heavy lifting: it extracts product data from WooCommerce's PHP objects and renders the data layer pushes in the page HTML. Events like view_item fire on page load, while add_to_cart fires via JavaScript when the button is clicked (including AJAX add-to-cart).

Variable product handling. WooCommerce variable products (size, color variants) need special attention. GTM4WP v1.18+ pushes the selected variation's data when the user picks options on the product page. Verify this in Tag Assistant — the item_variant field should update when the user selects a different variation.

What are common GA4 ecommerce tracking mistakes?

• Not clearing the ecommerce object. Without dataLayer.push({ ecommerce: null }) before each event, old product data merges with new events. A user viewing Product A and then Product B may send both products in the view_item event for Product B.
• Using wrong item field names. GA4 expects item_id and item_name, not id and name (which were Universal Analytics fields). This is the most common migration mistake.
• String values for price and quantity. "29.99" (string) vs 29.99 (number). GA4 may accept strings in some cases, but monetary calculations break. Always use numbers.
• Missing currency field. GA4 ignores value if currency is missing. Every event with a monetary value needs both fields.
• Duplicate purchase events. Firing the purchase event on a thank-you page that reloads or is bookmarked. Use transaction_id for deduplication and consider a server-side flag to prevent re-firing.
• Forgetting "Send Ecommerce data" in GTM. The GA4 Event tag fires, the event name appears in DebugView, but the items array is empty because the checkbox is not enabled.
• Inconsistent currency codes. Mixing USD and $ or EUR and Euro. Use ISO 4217 codes only.
• Not testing the full funnel. Testing only the purchase event and discovering months later that view_item never fires, breaking your funnel analysis.

Is there a faster way to set up ecommerce tracking?

Manual ecommerce tracking setup involves writing data layer pushes, creating multiple GTM tags and triggers, mapping parameters, and testing each event individually. For a full funnel with multiple platforms (GA4 + Meta + TikTok), the setup can take hours.

GTM Event Helper's AI Agent automates this workflow:

1. Select your ecommerce events. Choose from presets like view_item, add_to_cart, purchase, or let the AI suggest events based on your site type.
2. Pick elements on your page. For each event, click the relevant element (product card, add-to-cart button, checkout form). The extension captures the URL and element context.
3. AI generates extraction scripts. The AI analyzes your page DOM and creates scripts that dynamically extract product data — item name, price, SKU, quantity — from the page structure. No hardcoded values.
4. Multi-platform tags in one batch. Select your platforms — GA4, Meta Pixel, TikTok Pixel, Pinterest Tag, Snapchat Pixel — and the AI Agent creates all tags and triggers in your GTM workspace via the API. One click creates the data layer push, the Custom Event trigger, and platform-specific tags for every selected event.

The AI Agent handles the ecommerce-specific complexity automatically: ecommerce object clearing, items array structure, sendEcommerceData flag on GA4 tags, and correct trigger mapping. What takes an experienced analyst 2-3 hours manually takes under 10 minutes with the AI Agent.

The AI Agent supports GA4, Meta, TikTok, Pinterest, and Snapchat ecommerce events — from a single setup flow. Each platform gets its own properly formatted conversion tag.

External Resources

• GA4: Measure ecommerce (developer guide)
• GA4: Recommended events reference
• GTM: Set up GA4 event tags
• GA4: Custom dimensions and metrics
• GTM4WP: Google Tag Manager for WordPress

Related Articles

• GA4 Event Tracking Setup in GTM Without Code
• How to Track Button Clicks in GTM Without Writing Code
• Setting Up Enhanced Conversions in GTM
• CSS Selector Best Practices for GTM Triggers
• Track Dynamic Elements in GTM: Dropdowns, Tooltips, Popups

← All articles · Home · Privacy Policy · Contact