How to set up and track enhanced e-commerce in Google Tag Manager

Author:

Setting up and tracking Enhanced E-commerce in Google Tag Manager (GTM) involves several steps that allow you to capture more detailed transaction and product-related data from your website. Enhanced e-commerce provides richer insights into how users are interacting with your online store, from product impressions and clicks to checkout behavior and purchases.

Here’s a step-by-step guide on how to set up and track Enhanced E-commerce using Google Tag Manager and Google Analytics:

1. Prerequisites

  • Google Analytics (Universal Analytics) account.
  • Google Tag Manager (GTM) account set up on your website.
  • Your website should be an e-commerce site with a product catalog, shopping cart, and checkout process.

2. Enable Enhanced E-commerce in Google Analytics

First, you need to enable Enhanced E-commerce in your Google Analytics account.

  1. Sign in to Google Analytics.
  2. Select the view for which you want to enable Enhanced E-commerce.
  3. Click on Admin (gear icon) at the bottom left.
  4. In the View column, select E-commerce Settings.
  5. Set Enable E-commerce to ON.
  6. Set Enable Enhanced E-commerce Reporting to ON as well.
  7. Click Save.

This activates the ability to track e-commerce data in your Google Analytics account.

3. Install the Google Tag Manager (GTM) Container

If you haven’t already done so, install GTM on your website.

  1. Create a GTM container for your website if you don’t have one.
  2. Copy the GTM container snippet from your GTM account and paste it on every page of your website (in the <head> and <body> sections).

4. Set Up GTM Tags for Enhanced E-commerce

You’ll need to create tags in Google Tag Manager to send Enhanced E-commerce data to Google Analytics. Follow these steps to set up the necessary tags:

Step 1: Add Google Analytics Tag to GTM

  1. In GTM, go to Tags and click New.
  2. Select Tag Configuration and choose Google Analytics: Universal Analytics.
  3. Set the Track Type to Page View (this will be used to send page views to GA).
  4. Under Google Analytics Settings, select your GA settings variable, or input your Tracking ID manually (e.g., UA-XXXXX-Y).
  5. In the Triggering section, choose All Pages so that the pageview tag fires on every page.
  6. Save the tag.

Step 2: Create Variables for E-commerce Data Layer

To send Enhanced E-commerce data to Google Analytics, you need to pull specific data from your website’s data layer. This is where information like product impressions, clicks, and transactions will be stored.

  1. Open your website and inspect the data layer (you can use Chrome’s Developer Tools and go to the Console tab).
  2. Look for the relevant e-commerce variables in the data layer, such as:
    • transactionId
    • transactionAffiliation
    • transactionTotal
    • productName
    • productSKU
    • productPrice
    • currencyCode

These variables should be pushed to the data layer on the product pages, cart pages, and transaction confirmation pages.

  1. In GTM, go to Variables and click New to create the necessary variables that pull data from the data layer.
    • Choose Data Layer Variable for the variable type.
    • Set the Data Layer Variable Name to the corresponding value you found in the data layer, such as transactionId, productName, etc.

5. Configure the Data Layer on Your Website

For Enhanced E-commerce tracking, you need to implement the data layer on your website. Here’s how you can do that for different stages of the shopping experience:

Product Impressions and Clicks:

You need to push product impression and click data to the data layer when users view or click on a product.

javascript
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event': 'productImpression',
'ecommerce': {
'currencyCode': 'USD',
'impressions': [{
'name': 'Product 1',
'id': '12345',
'price': '29.99',
'brand': 'Brand A',
'category': 'Category 1',
'variant': 'Color: Blue'
}]
}
});

Add to Cart:

You also need to track when users add products to the cart.

javascript
window.dataLayer.push({
'event': 'addToCart',
'ecommerce': {
'currencyCode': 'USD',
'add': {
'products': [{
'name': 'Product 1',
'id': '12345',
'price': '29.99',
'quantity': 1
}]
}
}
});

Checkout:

Tracking users during the checkout process is essential for understanding their behavior.

javascript
window.dataLayer.push({
'event': 'beginCheckout',
'ecommerce': {
'currencyCode': 'USD',
'checkout': {
'actionField': {'step': 1},
'products': [{
'name': 'Product 1',
'id': '12345',
'price': '29.99',
'quantity': 1
}]
}
}
});

Purchase:

Finally, on the order confirmation page, you need to push transaction data.

javascript
window.dataLayer.push({
'event': 'purchase',
'ecommerce': {
'transactionId': 'T12345',
'affiliation': 'Online Store',
'value': 29.99,
'currencyCode': 'USD',
'coupon': 'SUMMER2024',
'purchase': {
'products': [{
'name': 'Product 1',
'id': '12345',
'price': '29.99',
'quantity': 1
}]
}
}
});

6. Create GTM Triggers for E-commerce Events

Now, create triggers in GTM that fire when the respective events occur.

  1. Product Impressions Trigger:
    • Go to Triggers in GTM and click New.
    • Select Custom Event as the trigger type.
    • Set the event name to match the event in the data layer, e.g., productImpression.
    • Save the trigger.
  2. Add to Cart Trigger:
    • Create a new Custom Event trigger for the addToCart event.
  3. Checkout Trigger:
    • Create a new Custom Event trigger for the beginCheckout event.
  4. Purchase Trigger:
    • Create a new Custom Event trigger for the purchase event.

7. Set Up Google Analytics E-commerce Tags in GTM

For each of the e-commerce events, create new Google Analytics Event tags in GTM.

  1. Go to Tags in GTM and click New.
  2. Select Tag Configuration, then choose Google Analytics: Universal Analytics.
  3. Choose Track Type: Event.
  4. In the Category, Action, and Label fields, map the relevant data from the data layer.
    • For example, for a purchase event, you might set the Category as E-commerce, the Action as Purchase, and the Label as the transactionId.
  5. In the Triggering section, select the appropriate trigger for the event (e.g., purchase trigger).

Repeat this for each event type (product impressions, add to cart, checkout, and purchase).

8. Test and Debug Enhanced E-commerce Tracking

Once all tags, triggers, and variables are set up, use the Preview Mode in GTM to test that everything is firing correctly.

  • Verify that the data is being sent to Google Analytics in the Real-Time Reports.
  • Use the Google Tag Assistant extension or GTM Debugger to make sure tags are firing properly.

9. Publish Your Container

After confirming that everything is working, publish your container in GTM.


Conclusion

Setting up Enhanced E-commerce tracking with Google Tag Manager allows you to gather rich insights into your customers’ shopping behavior and optimize your online store. By tracking product impressions, clicks, add-to-cart actions, checkout behavior, and purchases, you can gain a deeper understanding of how users interact with your site, identify potential bottlenecks, and improve your overall conversion rates.