Simple e-commerce tracking in GTM and GA4 using any CMS

E-commerce can sometimes seem like a complex topic. However, the truth is that it’s much more straightforward than it initially appears—especially when you have the right tools and frameworks. Unlike other events like contact forms or button clicks, which can vary greatly in design and implementation, e-commerce events are highly standardised, thanks to Google Analytics 4 (GA4) recommended events.

By leveraging GA4’s standardised e-commerce events, you can quickly and effectively track key customer interactions such as product views, cart additions, purchases, and more. This standardisation significantly simplifies the tracking process, making it very simple with the right regex.

In this guide, we’ll walk you through creating a simple regex in Google Tag Manager (GTM) to capture all of GA4’s recommended e-commerce events, demonstrating just how straightforward e-commerce tracking can be.

Here are the standard eCommerce events recommended by GA4:

view_item
view_item_list
select_item
view_cart
add_to_cart
remove_from_cart
begin_checkout
add_payment_info
purchase
refund
add_to_wishlist
view_promotion
select_promotion
view_search_results


Here's a simple regex pattern to capture all these events:

^(view_item|view_item_list|select_item|view_cart|add_to_cart|remove_from_cart|begin_checkout|add_payment_info|purchase|refund|add_to_wishlist|view_promotion|select_promotion|view_search_results)$


This regex will match any event name that exactly matches one of the 14 recommended eCommerce events listed above.

Steps to Implement in Google Tag Manager (GTM)


Step 1: Create a New Trigger
Navigate to Triggers: In your GTM container, click on Triggers.
Create a New Trigger: Click New and then choose Custom Event Trigger.
Configure the Trigger:
Name: GA4 eCommerce Events Trigger
Trigger Type: Custom Event
Event name: ^(view_item|view_item_list|select_item|view_cart|add_to_cart|remove_from_cart|begin_checkout|add_payment_info|purchase|refund|add_to_wishlist|view_promotion|select_promotion|view_search_results)$


Ensure the “Use regex matching” checkbox is checked.


Fire this trigger when an Event occurs on All Custom Events.


Step 2: Create a New Tag
Navigate to Tags: In your GTM container, click on Tags.
Create a New Tag: Click New and then choose Google Analytics: GA4 Event.
Configure the Tag:
Name: GA4 eCommerce Events Tag
Configuration Tag: Select your GA4 Configuration tag.
Event Name: {{Event}} (This will dynamically capture the event name that triggers the tag)
Triggering: Click on the Triggering section and select the trigger you created in Step 1 (GA4 eCommerce Events Trigger).

Select send ecommerce data and select the data layer as the source.


Step 3: Save and Publish
Save All Changes: Ensure that you save your new trigger and tag configuration.
Publish: Once everything is saved, publish your container changes.


Testing
Before you finalise, it's probably best to test everything:

Preview Mode: Use GTM's preview mode to test your setup and ensure that your tag fires correctly for each of the eCommerce events.


DebugView in GA4: Use the DebugView in your GA4 property to verify that the events are being recorded as expected.

You go through and buy something. Each stage of the purchase process should trigger events. However, as ecommerce has been standardised, you don't even have to test as it will just work. Sometimes it can be a hassle buying items on a live site and getting refunded. Sometimes the payment processor will still take their cut even if the transaction is refunded. So you can just wait 24 hours and it should just work.

With this setup, whenever one of the 14 recommended eCommerce events is triggered, the corresponding GA4 event tag will fire, sending the event data to your GA4 property. This approach ensures that you efficiently capture all recommended eCommerce interactions, providing valuable insights into the user journey and performance of your online store.

How to set up events and the data layer

Usually setting up the data layer and events is the developers job. With ecommerce platforms, you usually use a plugin. Some integrations like Shopify's native GA4 just does it all and you don't even need to set up tag manager.

For Woo commerce, you need something like GM4WP to send the events and datalayer. Its quite simple, just tick the integration

With bespoke e-commerce carts, you can still use the regex and data layer method described above. Just send your developer the spec for GA4 ecommerce events. But instead of sending straight to GA4, send the event and parameters to the data layer and let the regex sort it out.

Conclusion

So there you have it, ecommerce tracking in GA4 is very simple. By using the recommended events, you can take advantage of the funnels and machine learning that GA4 has built in.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *