GA4 Event Tracking: Setup Guide for E-Commerce

Google Analytics 4 is fundamentally event-driven. Unlike Universal Analytics where pageviews were the core unit, GA4 treats every interaction as an event. This gives you enormous flexibility — but also means that poor event setup leads to poor data. Most GA4 implementations I audit are collecting the default automatically-tracked events but missing the custom events that actually drive business decisions.

This guide covers the complete event tracking setup for e-commerce sites, from data layer configuration to debugging to building dashboards that surface actionable insights.

Automatically Collected vs Custom Events

GA4 automatically collects certain events without any configuration: page_view, session_start, first_visit, user_engagement, and scroll (when enhanced measurement is enabled). These are useful but generic.

Enhanced measurement events add scroll tracking, outbound clicks, site search, video engagement, and file downloads. Enable these in your GA4 data stream settings — they require no code changes.

Recommended events are Google-defined events with specific parameter structures. For e-commerce, these include view_item, add_to_cart, begin_checkout, and purchase. Using Google's naming convention unlocks built-in e-commerce reports.

Custom events are anything unique to your business: pricing_page_view, demo_request, feature_comparison, calculator_used. These are where the real insights live.

“The difference between a mediocre GA4 setup and a great one is not the tool — it's the 15-20 custom events that map precisely to your customer journey.”

Data Layer Setup

The data layer is a JavaScript object that sits on your page and holds structured information for GTM to read. It is the bridge between your website's data and your tracking tags. Without a proper data layer, you end up scraping DOM elements — brittle, unreliable, and a maintenance nightmare.

// Push product data when a user views a product page
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  event: 'view_item',
  ecommerce: {
    currency: 'USD',
    value: 49.99,
    items: [{
      item_id: 'SKU-12345',
      item_name: 'Premium Analytics Dashboard Template',
      item_category: 'Templates',
      item_category2: 'Analytics',
      item_brand: 'MarTech Tools',
      price: 49.99,
      quantity: 1
    }]
  }
});

Every e-commerce event follows this same pattern: a dataLayer.push() with the event name and an ecommerce object containing currency, value, and an items array. Consistency is key. If your add_to_cart event uses product_id but your purchase event uses item_id, your funnel reports break.

E-Commerce Event Tracking

A complete e-commerce tracking setup covers the full purchase funnel. Here are the events you need, in order:

1. 1.view_item_list — Category/collection pages. Include the list name and position of each product
2. 2.select_item — When a user clicks a product from a list
3. 3.view_item — Product detail page views. Include all product parameters
4. 4.add_to_cart — Fired when an item is added to cart. Include quantity and value
5. 5.view_cart — When the cart page or drawer is opened
6. 6.begin_checkout — First step of checkout process
7. 7.add_shipping_info — When shipping method is selected
8. 8.add_payment_info — When payment method is entered
9. 9.purchase — Transaction complete. Include transaction ID, revenue, tax, shipping

For each event, create a corresponding trigger in GTM that listens for the dataLayer.push() and a GA4 event tag that forwards the data. Use a single GA4 event tag with a variable-driven event name to keep your container clean.

Debugging with GTM Preview Mode

GTM's preview mode (Tag Assistant) is your best friend during implementation. Click “Preview” in your GTM workspace, enter your site URL, and a debug panel opens alongside your website.

• •Check data layer contents: Click any event in the timeline and inspect the Data Layer tab to verify parameters
• •Verify tag firing: The Tags tab shows which tags fired (or failed) on each event
• •Inspect variables: See the resolved values of all your GTM variables at each event
• •GA4 DebugView: Enable debug mode in GA4 to see events arrive in real-time at Admin → DebugView

A common debugging pattern: push an add_to_cart event, check that the data layer contains the correct product data, verify the GTM trigger fires, confirm the GA4 tag sends the event, and then check GA4 DebugView to see it arrive with all parameters intact.

Building Looker Studio Dashboards

Raw GA4 data becomes actionable only when it is visualized properly. Looker Studio (formerly Google Data Studio) connects directly to GA4 and lets you build dashboards that update automatically.

For e-commerce, I recommend building three core dashboards:

• •Funnel Performance: Visualization showing drop-off rates between each e-commerce step. Identify where users abandon the journey
• •Product Performance: Table showing each product's views, add-to-cart rate, and purchase conversion rate. Sort by revenue to find winners
• •Acquisition ROI: Blend GA4 data with Google Ads cost data to show true ROAS by campaign, ad group, and keyword

The key to effective dashboards is limiting them to the 5-7 metrics that actually drive decisions. If your team needs help with analytics setup and dashboard design, start with the questions you want answered and work backward to the data you need.