How to Setup Ecommerce Reporting in Google Tag Manager

Wondering how to setup ecommerce reporting in Google Tag Manager?

Getting your ecommerce data to report in Google Analytics can be tricky, but it doesn't have to be if you use Google Tag Manager.  Especially if you have an ecommerce platform or cart system that does not readily integrate with Google Analytics.

In our case, we use Infusionsoft which does not have a direct integration with Google Analytics. We had to purchase and use a WordPress plugin to get our ecommerce data to report.

Of course, you can always do custom scripts such as API calls, but that would take a certain level of technical knowhow to accomplish and this is probably ideal if you have an in-house, on-call developer (which most of us don’t).

Here is where Google Tag Manager saves the day — with the use of the data layer.

What Is A Data Layer?

The data layer is a piece of script that contains any information or variables that you want Google Tag Manager to read, and then report to Google Analytics — including ecommerce data. For the purpose of reporting ecommerce information to Google Analytics, the data layer tag will work hand in hand with a Google Analytics ecommerce tag.

IMPORTANT! BEFORE WE CONTINUE! Using the Google Tag Manager data layer using this specific methodology of implemention for ecommerce reporting is ideal if your ecommerce scenario meets the following criteria:

1. You have a simple sales funnel
2. You have 10 products/upsells or less and each order form/shopping cart goes to its own thank you page with different URLs
3. You DON’T change the pricing of your products on a regular basis
4. Your customers can only purchase one unit of a particular product

You will see later on why we enumerated these criteria as we go through the step by step of the setup process.

ONE MORE THING! Be sure that you enabled ecommerce in the view that you’re using in Google Analytics for ecommerce to report.

Now that those things are out of the way, it’s time to have fun with data layer!

There are two parts to this process — setting up a data layer push tag and setting up a Google Analytics ecommerce tag.

Setting Up The Data Layer Push Tag

This is how you push the transaction data you want to report to Google Analytics after a successful transaction and is going to fire on the Thank You Page.

As mentioned above, the data layer contains information that you want Google Tag Manager to push, read and report to Google Analytics. When it comes to ecommerce reporting, there’s only a certain set of variables or information that Google Analytics can report. Here are those variables taken directly from Google’s support documentation:

Transaction Data:

Google Analytics Data Layer - Transaction Data

 

 

 

 

 

 

 

 

Product Data:

Google Analytics Data Layer - Product Data

 

 

 

 

 

 

Notice that the highlighted variables are required variables and your ecommerce data will NOT report in Google Analytics unless this information is present in your data layer.

Here’s an example of what a data layer would look like:

google tag manager data layer

This is the actual data layer that we use for one of our products — Workshop Wednesday. Notice that the transactionId variable is dynamically populating with {{OrderID}} which is a URL parameter variable that we setup in Google Tag Manager. This value changes with every transaction and if you’re using Infusionsoft, you can also use this variable. But the important thing is to identify a unique identifier for every transaction that you can use to setup a variable to auto-populate the transactionId variable.

Let’s briefly walk through the other variables in the data layer:

– The transactionTotal is the total value of the entire transaction. If there’s shipping involved and you want this to be reflected in the transactionTotal, you can do so
– The sku is the product code that you use to identify your products. This could be the same as the SKU that you use in your cart or ecommerce platform
– The name is the name of your product
– The price is the unit price of the product itself, excluding tax and shipping
– The quantity is the number of units of a product that your customers purchased

All these variables have a hardcoded value for them. This is where the criteria we enumerate above comes into play. For instance, if you constantly experiment with the pricing of your products, you would need to remember to update your data layer every time you change your price points, unless you can find a way to dynamically populate the data layer. Same thing with quantity. If your customers can buy more than one unit of your product, then you need to find a way to auto-populate this variable.

Also, notice that the data layer is capped with a custom even variable ‘transactionComplete’. We will use this as a trigger later on for our Google Analytics ecommerce tag.

Again, you can add the other non-required variables to your data layer if you wish.

Setting Up The Data Layer Push Tag

Once you have your data layer, it’s time to fire it in Google Tag Manager. Here’s how.

Step 1. Create A New Custom HTML Tag

Name your new tag. I suggest having “Data Layer Ecommerce Push” on the name so you know it’s a data layer push tag and then add for which product it’s for. Then choose “Custom HTML”

data layer custom html tag

Paste your data layer script and click on continue.

data layer google tag manager

Step 2: Setup Your Trigger

The simplest way to fire your data layer push tag is to fire it on the Thank You page after a purchase. To do this, you need to setup a Pageview trigger and fire it on the Thank You page after a purchase.

Name your trigger so you can easily identify that it fires on the Thank You Page for a specific product purchase. Choose Pageview for Trigger Type and then enter the URL of the Thank You Page.

If there’s a fragment that gets attached to the URL after a transaction, you can use that to ensure that you are indeed firing the data layer on successful transactions (in the case of Infusionsoft, the orderId parameter gets attached to the URL after a purchase so we used it in the trigger conditions as you see below).

google tag manager data layer trigger

Save your trigger and publish your changes.

You’re done with the first part of the process.

Setting Up The Google Analytics Ecommerce Tag

Now that you have a data layer containing your ecommerce data getting pushed to the thank you pages, you now need to tell Google Tag Manager to read the data layer and report the information to Google Analytics.

This is what the Google Analytics Ecommerce Tag is for.

Here are the steps in setting up the ecommerce tag.

Step 1. Create A New Google Analytics Tag

Name your tag and choose Google Analytics under product.

google tag manager ecommerce data layer

Then…

(A) Select Universal Analytics as the Tag Type,

(B) Enter your Google Analytics Tracking ID, and

(C) Choose Transaction under Track Type.

Then click on Continue.

data layer google tag manager transaction

Step 2. Set Up Your Trigger

Remember the custom event that we used to cap the data layer? If not, here it is again:

google tag manager data layer event

We will use this custom event to fire our tag.

Create a new trigger and choose Custom Event.

google tag manager data layer custom event

Under “Fire On,” enter the name of your custom event. In our example it’s transactionComplete.

Then click on Create Trigger.

google tag manager google analytics

Publish your changes.

You Are Done!

You now have a tag that pushes the data layer containing the ecommerce data after a successful transaction AND a Google Analytics Ecommerce tag that reads the content of the data layer and report the information to Google Analytics.

Your next step is to make a test purchase to verify that your ecommerce data are reporting in Google Analytics. Take note that there could be up to 8 hours of delay before ecommerce transactions show up in your Google Analytics report, so make sure to test before major traffic hits your sales funnel.

The data layer is a powerful tool that marketers can use, not only in ecommerce reporting, but in other funnel tracking as well. For example, you can use the data layer to push several information after an opt-in. For one of our clients, we use the data layer to automate our opt-in event tracking. As long as there’s a “status” variable in the data layer that says “opt-in”, there’s a corresponding event that gets reported in Google Analytics. But ecommerce reporting is definitely one of the main reporting areas that you can use the data layer.

I hope this post helped you figure out how to setup ecommerce reporting in Google Tag Manager.  Whether you already have an ecommerce tracking in place and you’re looking for an alternative or even if you’re just going to open your online ecommerce platform.

If you have questions, please feel free to post them through the comments section below. And of course, feel free to share this post.

Until the next Google Tag Manager post!

– Darwin

About The Author

Darwin

As an experienced advertising and public relations professional, Darwin has a diverse background working on integrated marketing campaigns for several multinational corporations. He has been a valuable asset to the Seriously Simple Marketing Team since January 2014 where he has made contributions to the marketing, analytics, and optimization strategies of numerous direct response, e-commerce, and infomarketing companies. Darwin is a theatre enthusiast and once played the role of of Lieutenant Forster in a production of "Monster" -- a play based on Mary Shelley's novel ​"Frankenstein"​.

11 Comments

  • Orod

    Reply Reply March 9, 2016

    Hi Darwin,

    Thanks for your information!

    There is no “For” statement in “transactionProducts”, how would this code works if it comes more than one products in the transaction?

    http://dyv0jvboqn3ch.cloudfront.net/wp-content/uploads/2016/02/google-tag-manager-data-layer-event-e1454533671491.jpg

    • Darwin

      Reply Reply March 10, 2016

      Hi Orod! Here’s an example of a data layer with multiple products in the transaction: http://www.awesomescreenshot.com/image/1069344/ee0f5b12b9722e898c288e08556f1b28 However, please take note that the method discussed in this blog post is best used if you only have one product in the transaction, or if the products in a transaction remains constant. This is because the values are hard coded in the data layer and won’t dynamically populate if the user has several purchase option on the cart or order form. For this, we suggest tapping into a developer to come up with a way to dynamically populate the values of the data layer.

  • William

    Reply Reply August 25, 2016

    Great post! You saved me so much time!!!

    • Mercer

      Reply Reply August 25, 2016

      Happy to help William!

  • Hanifah

    Reply Reply January 20, 2017

    Wow, thanks for the info. Was trying to wrap my head around data-layers. This really helped.

    Question can you include additional inline and external javascipt within the data-layer script to automate the number of units of a product? Or is there another means to achieve this?

    • Mercer

      Reply Reply January 28, 2017

      Glad you found it useful! If you’ve got some javascript that you are using to figure out a value, take a look at using a “javascript variable” in Google Tag Manager instead. 🙂

  • Jure

    Reply Reply March 29, 2017

    Hello Darwin,

    thank you for a very educational post. However since i am a bit new to the Ecommerce tracking with GA and since i am not a developer I have a question regarding the implementation. My question is – We have to create a data layer and specify the parameters for every product in our Ecommerce separately? ( if we have 1000 products, every single one needs its own parameters and code specified? A new data layer and triggers? )

    Thank you for your answer in advance.

    Regards,

    Jure

    • Mercer

      Reply Reply May 2, 2017

      You’ll need to define the datalayer at the time of the transaction and it should include whatever is purchased at that point. Depending on your cart platform, they may already have an integration for this. Otherwise, your development team will be able to help build this one for you!

  • tatsuya

    Reply Reply April 24, 2017

    Thanks for the guide.
    Pushing datalayer as custom HTML teag seemed to work, but then run into problem causing the page to not load. Of course, every website is differnt. But I think the best solution is to include the correct variables within datalayer in-line that GA can listen to, as per google’s recommendation.

  • Akash

    Reply Reply May 18, 2017

    How can i track orderid and amount dynamicaly if i put {{orderid}} like this type in custom html box its giving unknown variable error? please kindly help

    Regards,
    Akash

    • Mercer

      Reply Reply June 8, 2017

      You’ll need to define the orderID variable first. In our case, we grab the OrderID value using a URL Variable in GTM.

Leave A Response

* Denotes Required Field