How to Set Up GA4 E-commerce Tracking in GTM - With Free Importable Template

If you're running an e-commerce site and want to understand how your customers shop, GA4 e-commerce tracking is essential. It lets you see everything from which products people view to what ends up in their cart, through to completed purchases and even refunds.

But here's the thing: GA4 can't magically know when someone adds a product to their cart. Your website needs to tell GA4 what's happening, and that's where the data layer comes in.

In this guide, I'll walk you through the different ways to implement GA4 e-commerce tracking, with a focus on the Google Tag Manager approach that gives you the most flexibility and control.

What is the Data Layer?

The data layer is a JavaScript object that acts as a middleman between your website and your tracking tools. When something happens on your site (like a purchase), your website pushes that information to the data layer in a structured format. Google Tag Manager then listens for these pushes and sends the data to GA4.

Think of it like a translator: your e-commerce platform speaks its own language, GA4 speaks another, and the data layer translates between them.

Here's what a typical data layer push looks like for a purchase event:

window.dataLayer = window.dataLayer || [];

// Clear previous ecommerce data (recommended)
dataLayer.push({ ecommerce: null });

// Push the event
dataLayer.push({
  event: 'purchase',
  ecommerce: {
    transaction_id: 'T12345',
    value: 59.99,
    tax: 4.99,
    shipping: 5.99,
    currency: 'GBP',
    items: [{
      item_id: 'SKU123',
      item_name: 'Premium ID Card',
      price: 49.01,
      quantity: 1,
      item_category: 'ID Cards',
      item_brand: 'Digital ID'
    }]
  }
});

The GA4 E-commerce Events You Need

GA4 has a predefined set of e-commerce events. Using these exact event names is important because GA4 automatically populates standard reports and the monetisation section when it recognises them.

Event When to Fire
view_item_list When a user views a list of products (category page, search results)
select_item When a user clicks on a product from a list to view it
view_item When a user views a product detail page
add_to_cart When a user adds a product to their cart
remove_from_cart When a user removes a product from their cart
view_cart When a user views their cart page
begin_checkout When a user starts the checkout process
add_shipping_info When a user submits their shipping information
add_payment_info When a user submits their payment information
purchase When a user completes a purchase (order confirmation page)
refund When a refund is processed (often server-side)

Implementation Methods: Which One Should You Use?

There are three main ways to implement GA4 e-commerce tracking. Each has its pros and cons.

1. Native gtag.js Implementation

This involves adding Google's tracking code directly to your website and calling gtag() functions when e-commerce events occur. It's the simplest approach if you have a small site and direct access to the code, but it means your tracking logic is hardcoded into your website.

Pros: Simple, no GTM needed

Cons: Requires code changes for any tracking updates, less flexible

2. Google Tag Manager with Data Layer (Recommended)

This is the approach I recommend for most businesses. Your developer implements the data layer pushes, and then you configure GTM to listen for those events and send them to GA4. This separates your tracking configuration from your website code.

Pros: Flexible, no code changes needed for tracking updates, version control, easy testing

Cons: Initial setup requires developer involvement for data layer

3. Server-Side Tracking

E-commerce events are sent from your server rather than the browser. This is the most robust option but requires more technical setup. It's particularly useful for the purchase event, where you want to ensure every transaction is tracked regardless of what happens in the browser.

Pros: More accurate, not affected by ad blockers, better for sensitive data

Cons: More complex setup, requires server-side GTM container or Measurement Protocol

Setting Up GA4 E-commerce Tracking in GTM

Once your developer has implemented the data layer pushes, the GTM configuration is straightforward. Here's what you need:

Step 1: Create Custom Event Triggers

For each e-commerce event, create a Custom Event trigger that fires when that specific event is pushed to the data layer.

  1. Go to Triggers > New > Custom Event

  2. Enter the event name exactly as it appears in the data layer (e.g., 'purchase')

  3. Name it clearly: 'purchase | Custom Event'

Step 2: Create GA4 Event Tags

For each trigger, create a corresponding GA4 Event tag.

  1. Go to Tags > New > Google Analytics: GA4 Event

  2. Enter your Measurement ID (or use a Constant variable)

  3. Set the Event Name to match (e.g., 'purchase')

  4. Tick 'Send Ecommerce data' and select 'Data Layer'

  5. Attach the corresponding trigger

The 'Send Ecommerce data' checkbox is the key setting here. When enabled, GTM automatically reads the ecommerce object from the data layer and sends it to GA4 in the correct format. You don't need to manually map each parameter.

Step 3: Create a Measurement ID Variable

Rather than hardcoding your GA4 Measurement ID into each tag, create a Constant variable. This makes it easier to update if needed and keeps things tidy.

  1. Go to Variables > User-Defined Variables > New

  2. Choose 'Constant'

  3. Enter your GA4 Measurement ID (G-XXXXXXXXXX)

  4. Name it: 'GA4 Measurement ID | Constant'

Save Time: Import This GTM Container Template

Setting up all these tags and triggers manually is tedious. I've created a GTM container template that includes everything you need for standard e-commerce tracking. It includes 11 event tags, 11 corresponding triggers, and a Measurement ID variable.

Events included:

  • view_item_list, select_item, view_item

  • add_to_cart, remove_from_cart, view_cart

  • begin_checkout, add_shipping_info, add_payment_info

  • purchase, refund

How to import:

  1. Download the JSON file (link at the end of this post)

  2. In GTM, go to Admin > Import Container

  3. Select the JSON file

  4. Choose 'Merge' > 'Rename conflicting tags, triggers, and variables'

  5. After import, update the 'GA4 Measurement ID | Constant' variable with your actual Measurement ID

  6. Delete any events you don't need

Data Layer Examples for Your Developer

Here are copy-paste examples your developer can use as a starting point. The structure follows Google's GA4 e-commerce schema.

view_item_list (Category Page)

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'view_item_list',
  ecommerce: {
    item_list_id: 'category_biodegradable',
    item_list_name: 'Biodegradable Cards',
    items: [
      {
        item_id: 'SKU001',
        item_name: 'Eco Card White',
        price: 12.99,
        index: 0,
        item_category: 'Biodegradable Cards'
      },
      {
        item_id: 'SKU002',
        item_name: 'Eco Card Blue',
        price: 13.99,
        index: 1,
        item_category: 'Biodegradable Cards'
      }
    ]
  }
});

begin_checkout

dataLayer.push({ ecommerce: null });
dataLayer.push({
  event: 'begin_checkout',
  ecommerce: {
    currency: 'GBP',
    value: 18.49,
    items: [{
      item_id: 'SKU123',
      item_name: 'Dyster White 750 Micron Biodegradable Cards',
      price: 18.49,
      quantity: 1,
      item_category: 'Biodegradable Cards',
      item_brand: 'Dyster'
    }]
  }
});

Required Item Parameters

At minimum, each item in the items array should include:

Parameter Description
item_id SKU or product identifier
item_name Product name
price Unit price (numeric, no currency symbol)
quantity Number of units
item_category Product category
item_brand Brand name (if applicable)

Pro Tip: Always clear the ecommerce object before pushing a new event. This prevents stale data from previous events bleeding into the current one. Add dataLayer.push({ ecommerce: null }); before each e-commerce push.

Testing Your Implementation

Before publishing, test everything thoroughly:

1. GTM Preview Mode

Click Preview in GTM and walk through a complete purchase flow on your site. Check that each event fires at the right moment and that the ecommerce data is being captured correctly. You should see the ecommerce object in the Variables tab when each event fires.

2. GA4 DebugView

In GA4, go to Admin > DebugView. This shows events as they arrive in real-time. Look for your e-commerce events and click on them to verify all parameters are coming through correctly.

3. Browser Console

Open your browser's developer tools and type 'dataLayer' in the console. This shows you exactly what's being pushed. Useful for debugging data layer issues.

Common Issues and How to Fix Them

Events firing but no revenue data

Make sure 'Send Ecommerce data' is ticked in your GA4 Event tags and that the data layer includes the 'value' and 'currency' parameters at the event level (not just inside items).

Duplicate transactions

If users can refresh the thank you page and the purchase event fires again, you'll get duplicates. Ask your developer to only fire the purchase event once per transaction, typically by checking if the order has already been tracked (using a cookie or session variable).

Stale ecommerce data

If you see items from a previous event appearing in the current event, the ecommerce object isn't being cleared. Ensure your developer adds dataLayer.push({ ecommerce: null }) before each new e-commerce event.

Events not showing in GA4 reports

GA4 can take 24-48 hours to populate standard reports. Use DebugView for real-time verification. Also check that you're using the exact event names GA4 expects (they're case-sensitive).

Next Steps

Once your e-commerce tracking is in place, you'll be able to see your full purchase funnel in GA4's monetisation reports, understand which products drive the most revenue, identify where customers drop off in the checkout process, and measure the true ROI of your marketing campaigns.

If you need help implementing GA4 e-commerce tracking or want a full audit of your current setup, get in touch. I work with businesses and agencies to ensure tracking is accurate, compliant, and actually useful for decision-making.

Previous
Previous

How to Track Cliniko Bookings from Embedded Iframes in GA4 and Google Ads

Next
Next

Legal Marketing Law Firm Benchmarks: Insights from GA4 Data