ADvance Checkout Next Gen- Configuring e-commerce tracking

Google e-commerce tracking events are built into the checkout. Tracking these events is easy with Google Tag Manager and Google Analytics.

This document assumes you have a working knowledge of Google Analytics and Google Tag Manager. Please contact your Account Manager if you require help from Abacus in setting up tracking.

To set up and add e-commerce tracking, navigate to:

Configuration > Brands> YOUR BRAND > Branding > Site Branding tab

Add the GTM ID

Add your GTM ID to the field - this will load your GTM container to the Checkout and Middleware applications.

Adding dataLayer items needed to support e-commerce tracking

The Text Asset called Metadata Extraction - Checkout contains the JavaScript variables that are used for the e-commerce tracking.

These fields MUST be present for the e-commerce tracking to work.

Add events to GTM

An example GTM container is attached at the bottom of this article. This can be loaded into your GTM container, or a separate container, and used to copy events. More information on importing containers is available on the GTM documentation site.

This will load the following items into GTM:

• Tags:
  • GA4 - add_billing_info (custom)
  • GA4 - add_payment_info
  • GA4 - add_shipping_info
  • GA4 - add_to_cart
  • GA4 - begin_checkout
  • GA4 - purchase
• Triggers:
  • GA4 - add_billing_info (custom)
  • GA4 - add_payment_info
  • GA4 - add_shipping_info
  • GA4 - add_to_cart
  • GA4 - begin_checkout
  • GA4 - purchase
• Variables:
  • GA4 - Ecommerce - currency
  • GA4 - Ecommerce - items
  • GA4 - Ecommerce - shipping
  • GA4 - Ecommerce - tax
  • GA4 - Ecommerce - transaction_id
  • GA4 - Ecommerce - value
  • GA4-ID

Event details 

Learn how to report on Purchases in Google Analytics

Unsupported e-commerce events

The following events are not supported or not relevant to the checkout.

• refund
• add_to_cart
• add_to_wishlist
• remove_from_cart
• select_item
• select_promotion
• view_cart
• view_item
• view_item_list
• view_promotion

Metadata for logged in users

It is possible to output metadata about the current user on the checkout pages when they are logged in.

The Metadata Extraction Text Asset allows these to be added to the pages. This follows the same format as the text asset used for V1 of the Advance front end. Please note that both versions need to be populated.

Data can be pushed into the dataLayer to be picked up by GTM.

More information on the available metadata and how to add custom dimensions to Google Analytics.

Google Analytics - tips

The checkout is built using React and, unlike traditional websites, will not load a new page for every user interaction. Depending on the level of detail you require it may be necessary to fire GA page views on History change as well as page load to capture all interactions of the user journey.

Add History Change triggers to your page view tag in GTM.

Abacus recommends setting two triggers. One for the Auth / Middleware and one for the Checkout.

You can limit the scope of these triggers to the Auth and Checkout URLs.

Example of History Change pages 

In the Middleware the page will not reload when:

• User moves from email to either create account or enter password
• User presses edit on their email address
• User goes to forgotten password
• User activates forgotten password

By using the History Change trigger this will capture these journeys in Google Analytics

Web Activity

Web Activity will show in the Party record and is available in BI reports.

Unlike Google Analytics events - Web Activity requires a user to have been created in ADvance before the activity can be captured.

The following web activities will fire in the checkout.