Google Analytics Ecommerce Tracking Using Google Tag Manager
With the introduction of Enhanced Ecommerce Analytics in Google Analytics this year, having even rudimental ecommerce tracking set up in GA is now essential. It still surprises me how many Google Analytics accounts that we start work on that don’t even track their own revenue or some sort of return on their ad spend. So many GA users simply use GA as a “hit counter” and not the powerful free insight generator that it is. It’s absolutely vital to attribute monetary value to each of your traffic sources so you can see exactly what digital marketing channels are generating revenue and how much exactly. All sorts of additional insights and ideas can be generated from this core set of data. Google have of course gone one step further in making this easier with the availability of the free Google Tag Manager tool. In this article, I’ll show you how to implement Google Analytics standard ecommerce tracking using Google’s free Google Tag Manager tool.
Collecting The Transaction Details For The Data Layer
Before we begin, we need to understand how GA collects data and what data we need to give it to populate the reports. It’s vital that we get this right as ecommerce reports permeate throughout every report in GA. Google Analytics can collect almost every piece of data about a transaction that you can imagine. For the purposes of this article, we’ll only look at the bare minimum, the required values.
When a user successfully completes a transaction on your site, they are usually directed to a “thank you” or receipt page. The receipt page shows the details of the transaction and we can use this opportunity to send the transaction details to Google Analytics via the Google Tag Manager dataLayer. The minimum required values to trigger a transaction and record it in GA are:
- Transaction ID
- Total Price
- Tax
- Shipping
You’ll also need some info about the items that were purchased:
- Product Name
- SKU
- Price
- Quantity
With some coding you can use this useful information for tracking the transactions in Google Analytics. We’re now going to take those values and pass them to Google Tag Manager who will in turn, pass them to Google Analytics.
Setting up Google Analytics
This part is easy. You simply need your tracking ID and to flick the ecommerce tracking switch. The only info you’ll need from your Google Analytics account is your tracking ID. You can get this in the admin section of your GA account.
Within your GA admin settings you’ll also need to enable eCommerce tracking – in the top navigation bar go to Admin >> View Settings (in the right column) Switch “Ecommerce tracking” ON under “Ecommerce Settings”. That’s the beauty of using GTM. That’s all you need to do. You’re now done with Google Analytics!
Setting up Google Tag Manager & The DataLayer
You need to be logged in to your google account in order to use Google Tag Manager. Go to the Google Tag Manager site and click “Sign In” in the upper right corner.
If you don’t have an account yet, you’ll be taken to the “Get Started Screen.
Type in your account name – we’ll use “Your Company” in our example – an account can contain multiple containers, so your company name can be the account name and your websites can have their own containers.
Click next. On this screen enter your website name where you’ll use this container. We’ll use “Your Website” as example
Under “Where to Use Container” select “Web Pages”, you can add your domain (optional) for useful suggestions throughout the interface. Set the time zone and click “Create Account and Container”. Accept the policy in the popup window, and on the next screen you’ll get your Google Tag Manager code.
This is the code you need to add to your website, immediately after the opening tag. Now when you access Google Tag Manager, you’ll see your account “Your Company” on the account list.
By clicking your account name “Your Company” you’ll be taken to the screen with the list of your containers.
To manage a container, click its name on the list. The next screen is for managing the tags in your GTM container.
We’ll need to create two tags, one basic analytics for tracking pegeviews and another one for tracking ecommerce transactions.
Click “New” and select “Tag” from the dropdown.
For the basic analytics tag add name “Basic Analytics”, select Tag Type -> Google Analytics -> Universal Analytics
For Tracking ID put in your tracking ID from Google Analytics
Under “Track Type” select “Page View”
This tag must fire on all pages. On the right where it says “Firing Rules” click add and select the pre-defined “All pages” rule. Click Save
Save your new tag and create the eCommerce tracking tag using these details:
Tag Name eCommerce tracking
Tag Type -> Google Analytics -> Universal Analytics
Tracking ID – again your tracking ID from Google Analytics
Under “Track Type” select “Transaction”
This tag must fire on your receipt page, where the data layer is located (we’ll add that in the next section). You need to create a rule for your receipt page. On the right where it says “Firing Rules” click add and select “Create new rule”. As condition set {{url}} equals and type in your receipt page URL.
Save your rule and your new tag. You’ll be taken back to the container management screen. In the top right corner click Publish, then in the small popup click “Create Version and Publish”
Once you add the GTM container code to your website after the opening <body> tag, the analytics tags we’ve added to the container will be live. You’re now tracking regular Google Analytics.
Creating the dataLayer
The dataLayer is a small javascript JSON object that holds a list of key-value pairs to be used in Google Tag Manager. Actually Google Tag Manager pulls the data from the data layer on your website for the Google Analytics eCommerce tracking tag that will send the data to Google Analytics.
The below code is based on Google’s example, but rewritten to output the dataLayer instead of the Universal Analytics snippet
You can use this on your thank you page or receipt page, simply change out the sample data to match your own data and you’re good to go. You’ll need a programmer or someone that’s comfortable with php/javascript and coding to implement this for you. Alternatively, contact us and we can get installed for you in an hour or two. We’ll be doing a follow up post here to show you how to implement this on all the common WordPress ecommerce plugins.
<?php // Transaction Data $trans = array('id'=>'1234', 'affiliation'=>'Acme Clothing', 'revenue'=>'11.99', 'shipping'=>'5', 'tax'=>'1.29'); // List of Items Purchased. $items = array( array('sku'=>'SDFSDF', 'name'=>'Shoes', 'category'=>'Footwear', 'price'=>'100', 'quantity'=>'1'), array('sku'=>'123DSW', 'name'=>'Sandles', 'category'=>'Footwear', 'price'=>'87', 'quantity'=>'1'), array('sku'=>'UHDF93', 'name'=>'Socks', 'category'=>'Footwear', 'price'=>'5.99', 'quantity'=>'2') ); ?> <?php // Function to return the JavaScript representation of a TransactionData object. function getTransactionJs(&$trans) { return <<<HTML 'transactionId': '{$trans['id']}', 'transactionAffiliation': '{$trans['affiliation']}', 'transactionTotal': '{$trans['revenue']}', 'transactionShipping': '{$trans['shipping']}', 'transactionTax': '{$trans['tax']}', 'transactionProducts': [ HTML; } // Function to return the JavaScript representation of an ItemData object. function getItemJs(&$transId, &$item) { return <<<HTML { 'sku': '{$item['sku']}', 'name': '{$item['name']}', 'category': '{$item['category']}', 'price': '{$item['price']}', 'quantity': '{$item['quantity']}' }, HTML; } ?> <!-- Begin HTML --> <script> <?php echo "dataLayer = [{"; echo getTransactionJs($trans); foreach ($items as &$item) { echo getItemJs($trans['id'], $item); } echo "] }];"; ?> </script>
The World Is Your Oyster
Once you have the above code correctly installed, you can then see the ecommerce data flow in as transactions mount up. If you’ve never had this data in your account before, it will be a big change. The whole way you look at Google Analytics will change. So where to from here? I’d recommend the Digital Fundamentals course that’s free at the Analytics Academy. When you’re done with that, the Ecommerce Analytics course (also free) is well worth investing a few hours in.
Get the Flash Player to see this Google Ads tutorial about building your keyword list.
September 25th, 2014 at 9:45 am
Yeh it is really helpful you need create that tracking code or you need put SKU no so that you can see your revenue as well as transaction. Thanks for sharing its awesome post…
November 3rd, 2014 at 6:41 pm
I don’t get last part quite… I have magento store and I would most probably need to add some kind of PHP code that dynamically generates all transaction data?!
June 12th, 2015 at 9:06 pm
Hi Boki,
There is a free extension for Magento Store called “Google Tag Manager”, it provides built in data layer support for transaction data.
October 27th, 2015 at 11:17 pm
Thanks! This is actually a very helpful article. I’m creating a new ecommerce store right now – and this is very comprehensive guide to follow. I actually didn’t know there was GA specifically for ecommerce.