Implementing Enhanced Ecommerce tracking in Google Analytics – Nerd Guide

This article is in conjunction with the article Beginners Guide to Enhanced Ecommerce tracking in Google Analytic where I introduced the concept of enhanced ecommerce, explained it benefits, explained various enhanced ecommerce metrics/reports and how enhanced ecommerce is different from the traditional ecommerce tracking.

If you have not already read this article, then I would strongly suggest you to read it, before reading this advanced article on the same topic.

 

Caveat

I have shared lot of tracking code throughout this article.

This tracking code is pretty close to actual tracking code used for implementing enhanced ecommerce tracking but it is not the code which you can simply copy-paste without modification and then expect enhanced ecommerce tracking to automatically start working on your website.

This is because,

Enhanced ecommerce tracking just like the traditional ecommerce tracking cannot be implemented without adding a server side script to the enhanced ecommerce tracking code.

The objective of this article is to provide a framework through which you or your developer can implement enhanced ecommerce on your website.

 

Eleven most important shopping activites

Following are the 11 most important shopping activities on a ecommerce website:

#1 A user view an internal promotion campaign (like internal banner on a home page).

#2 The user click on the internal promotion campaign and is then redirected to a product list page (which can be a product category page or internal search result page).

#3 The user view a product in the product list.

#4 The user clicks on one of the product link in the product list to view more details about the product.

#5 The user then view the product details page.

#6 The user then decides to buy the product. So he adds the product to shopping cart. He may add multiple products to his shopping cart.

#7 The user may later decide to remove certain product from the shopping cart before starting the checking out process.

#8 The user then decides to start the checkout process and complete the various steps in the process.

#9 The user provides additional information during checkout (like select a payment or shipping method).

#10 The user finally completes the checkout process by making a purchase.

#11 The user may later decide to ask for a refund of his order.

In enhanced ecommerce, we can track all of these 11 shopping activities (and more), in order to get a deep insight into shopping behaviour.

 

#1 Measuring internal promotion impressions

Internal promotions are those ads (like a banner ad) which take users to other parts of your website.

For example, you may run a banner ad on the home page, which promote a particular product category and when a user clicks on the banner ad, he is redirected to the product category page.

The viewing of an internal promotion is called internal promotion impression.

So if a user view a banner ad on the home page two times, then the number of internal promotion impressions would be 2.

Following is an example of a tracking code which measures the internal ad impression:

This tracking code is placed on the web page, where you are running your internal promotion ad and whose impressions (views) you want to measure.

The highlighted code (in bold text) below is the enhanced ecommerce tracking code. The rest of the code is the Google Analytics tracking code:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);
ga(‘require’, ‘ec’);
ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
ga(‘send’, ‘pageview’);
</script>

Here,

ga(‘require’, ‘ec’); is a Google Analytics command which is used to load the enhanced ecommerce plugin. Without this plugin, your enhanced ecommerce tracking won’t work.

ga(‘ec:addPromo’,promoFieldObject); is the enhanced ecommerce command which is used to collect and store impression data of an internal promotion campaign. This command is made up of:

#1 ec:addPromo – it is a Google Analytics command which is used to measure internal promotion impressions and send the impression data to promoFieldObject

#2 promoFieldObject – it is a JavaScript object which is used to store impression data of internal promotion campaigns and it looks like the one below:

{
// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’


}

Following are the various properties of promoFieldObject:

  1. id
  2. name
  3. creative
  4. position


Note: To learn more about JavaScript objects, read this article:  Google Tag Manager Data Layer explained like never before

[Server Variable] – these are the server side variables. You need to ask your developer to write a server side script which populate the various fields (server variables) of the tracking code above, with the actual data.

Note: use your own property ID (instead of ‘UA-XXXX-YY’) in the tracking code above.

Now I am going to explain the various components of the tracking code which is used for measuring internal promotion impressions in greater detail.

 

Introduction to hits and hit type

In the context of Google Analytics, a hit is a user interaction with your website/mobile app. The data you send to a Google Analytics Web Property is also known as ‘hit’.

The type of data you send to a Google Analytics web property is known as Hit Type. For example, ‘pageview’, ‘event’, ‘transactions’, ‘item’ etc are all hit types.

 

Introduction to trackers

Tracking object (also known as tracker) is used to send hit data to Google Analytics (GA) web property:

tracking object

Without first creating and using a tracking object, you can not send hit data to a GA property.

Google Analytics ‘create’ command is used to create a tracking object and to associate the tracking object with a web property.

For example, the following line of code, creates a default tracking object:

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);

You can see this line of code in your Google Analytics tracking code.

To learn more about trackers, read this article: Understanding trackers in Google Analytics

 

Introduction to Enhanced Ecommerce Plugin

In order to implement enhanced ecommerce tracking on your website, you need to use the enhanced ecommerce plugin (also called ‘ec’ in short).

The Google Analytics command which is used to load the enhanced ecommerce plugin is:

ga(‘require’, ‘ec’);   // load enhanced ecommerce library

This command is similar to the command which is used to load the traditional ecommerce plugin in Google Analytics:

ga(‘require’, ‘ecommerce’);  // load traditional ecommerce library

 

How to use Enhanced Ecommerce Plugin

Just like traditional ecommerce plugin, the enhanced ecommerce plugin must also be loaded, after your tracking object and before you use any of the enhanced ecommerce tracking commands (like: ec:addProduct).

For example:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);
ga(‘require’, ‘ec’); // load enhanced ecommerce plugin
ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
ga(‘send’, ‘pageview’);
</script>

If you load enhanced ecommerce plugin before your tracking object, then enhanced ecommerce tracking won’t work.

So following tracking code won’t measure internal promotion impressions:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘require’, ‘ec’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);

ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
ga(‘send’, ‘pageview’);
</script>

 

Send enhanced ecommerce data along with a hit

The ecommerce/enhanced ecommerce data can be sent, only along with a hit (pageview, event etc).

So if you use an enhanced ecommerce command but do not send any hit, then your ecommerce data will not go, to your web property.

For example following tracking code won’t send internal promotion impression data to GA (as ga(‘send’, ‘pageview’); code is missing):

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);
ga(‘require’, ‘ec’);
ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
<< code to send the hit data is missing >>
</script>

The correct tracking code is:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘require’, ‘ec’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);

ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
ga(‘send’, ‘pageview’);
</script>

 

Use enhanced ecommerce command before you send hit

If you execute an enhanced ecommerce command after a hit has been sent, then also your ecommerce data will not go to your web property.

For example following tracking code won’t send internal promotion impression data to GA:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘require’, ‘ec’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);

ga(‘send’, ‘pageview’);

ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
</script>

The correct tracking code is:

<script>

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’);

ga(‘require’, ‘ec’);

ga(‘create’, ‘UA-XXXXX-YY’, ‘auto’);

ga(‘ec:addPromo’,{

// promoFieldObject stores internal promotion impression data

‘id’: ‘[Server Variable]’, // internal ad ID – Required – Type: string – Example: ‘homeBanner1’

‘name’: ‘[Server Variable]’, // internal promotion campaign Name – Type: string – Example: ‘Spring sale’

‘creative’: ‘[Server Variable]’, // internal ad name – Type: String – Example: ‘Spring Sale banner1’

‘position’: ‘[Server Variable]’ // Position of the internal ad – Type: string – Example: ‘home top banner’

});
ga(‘send’, ‘pageview’);
</script>

Such little detail comes handy, when you are testing your enhanced ecommerce implementation.

Whenever you don’t see ecommerce data in your reports, make sure that you are not making such hard to spot mistakes.

 

#2 Measuring clicks on internal promotion

In a purchase journey a user may click on an internal promotion campaign.

Tie the following function via a Javascript event handler onClick to measure the clicks on an internal promotion campaign (like internal banner):

This tracking code is placed on the web page, where you are running your internal promotion ad and whose clicks  you want to measure.

Here,

ga(‘ec:setAction’, <action-type>,actionFieldObject); – This enhanced ecommerce command is used to collect and store data related to enhanced ecommerce action. This command is made up of:

#1 ec:setAction – it is a google analytics command which is used to measure ecommerce action data and then send the data to actionFieldObject.

#2 <action-type> – it denotes following ecommerce user actions:

  1. promo_click’ – For example: ga(‘ec:setAction’, ‘promo_click’); // measure clicks on an internal promotion
  2. detail’- For example: ga(‘ec:setAction’, ‘detail’); // product detail views
  3. add’ – For example: ga(‘ec:setAction’, ‘add’); // measure Product Add to Cart.
  4. remove’ – For example: ga(‘ec:setAction’, ‘remove’); // measure Product remove from Cart
  5. checkout‘ – For example: ga(‘ec:setAction’,’checkout’, {‘option’: ‘visa’}); // measure additional information about a checkout step
  6. purchase’ – For example: ga(‘ec:setAction’, ‘purchase’,{…}); // measure a purchase.
  7. refund’ – For example: ga(‘ec:setAction’, ‘promo_click’); //measure the refund of one or more products.

#3 actionFieldObject – it is a JavaScript object which is used to store ecommerce action data. This object can look like the one below:

{

// actionFieldObject stores action data

‘id’: ‘VBT145346’,                   // Transaction id – Type: string

‘affiliation’: ‘VB Store’,           // Store name – Type: string

‘revenue’: ‘37.39’,                  // Total Revenue – Type: numeric

‘tax’: ‘2.85’,                       // Tax – Type: numeric

‘shipping’: ‘5.34’,                  // Shipping – Type: numeric

‘coupon’: ‘SUMMER2013’               // Order/Transaction coupon – Type: string

‘list’: ‘Shirts Category’,           // Product list – Type: string

‘step’: 1,                           // Number representing a step in the checkout process – Type: numeric

‘option’: ‘paypal’,   // Used to provide additional info about a checkout step like payment method used- Type: string

};

Following are the properties of actionFieldObject:

  1. id
  2. affiliation
  3. revenue
  4. tax
  5. shipping
  6. coupon
  7. list
  8. step
  9. option

The ‘onPromoClick’ function can be tied via a JavaScript event handler ‘onClick’ like this:

<a href=”/tops/” onClick=”onPromoClick();”><img src=”/prod/summersalepromo.jpg”></a>

Ask your developer to write a script which populate the various fields (server variables) of your tracking code with the actual data.

Note: Do not send internal promotion impression data along with internal promotion click data in just one hit. Send internal promotion click data in a separate hit after sending the impression data.

The complete code may look like the one below:

 

#3 Measuring Product impressions

In a purchase journey a user may view a product in the product list (product category page or internal search result page).

The viewing of a product in a product list is called product impression.

Use the following product impression tracking code on pages where your products are listed:

Here,

ga(‘ec:addImpression’,impressionFieldObject); is the enhanced ecommerce command which is used to collect and store product impression data. This command is made up of:

#1 ec:addImpression – it is a Google Analytics command which collect/measures product impressions and send the impression data to impressionFieldObject

#2 impressionFieldObject – it is a JavaScript object which is used to store product impression and it looks like the one below:

{

// ImpressionFieldObject stores product impression data

‘id’: ‘[Server Variable]’, // Product ID/SKU – Type: string

‘name’: ‘[Server Variable]’, // Product name – Type: string

‘category’: ‘[Server Variable]’, // Name of the Product category.

// Use / as a delimiter to specify up to 5 levels of hierarchy (e.g Men/Shirts/T-Shirts) – Type: string

‘brand’: ‘[Server Variable]’,// Name of Product brand – Type: string

‘variant’: ‘[Server Variable]’, // Variant of the product like: color, size etc – Type:string

‘list’: ‘[Server Variable]’, // Name of the Product list like ‘search results’ – Type: string

‘position’: [Server Variable] // Product position in a list. For example 2 – Type: numeric

}

Note: An impressionFieldObject must have a name or id value. All other values are optional

Following are the properties of impressionFieldObject:

  1. id
  2. name
  3. category
  4. brand
  5. variant
  6. list
  7. position

You need to ask your developer to write a server side script (like PHP) which loop through all the products on a page and send product impression data for each of them. The script should automatically populate the various fields (server variables) of your tracking code with the actual product data.

Note(1): Your product impression tracking code would look quite different once the server side script has been added to it.

Note(2): Do not send internal promotion click data along with product data in a single hit. If you need to send internal promotion click data then send it in a separate hit.

 

#4 Measuring click on a product link in the product list (measure product clicks)

In the purchase journey, a user may click on a product link, in the product list, to view more details about the product.

Tie the following function via a Javascript event handler ‘onClick’ to the links of all the products listed on a page:

Here,

ga(‘ec:addProduct’,productFieldObject); is the enhanced ecommerce command which is used to collect and store all product data (other than product impression data). This command is made up of:

#1 ec:addProduct – it is a Google Analytics command which collect/measures all product data (other than product impression data) and then send the product data to productFieldObject. 

#2 productFieldObject – it is a JavaScript object which is used to store all product data (other than product impression data). Data for following type of products is stored in this JavaScript object:

  1. Individual products that were viewed in a product list (product
  2. Products whose detail pages were viewed
  3. Products added to the shopping cart
  4. Products removed from shopping cart
  5. Products at each step of the checkout process
  6. Products that are purchased
  7. Products that are part of a refund.

The productFieldObject looks like the one below:

{

// productFieldObject stores product click and other details

‘id’: ‘[Server Variable]’, // Product ID/SKU – Type: string

‘name’: ‘[Server Variable]’, // Product name – Type: string

‘category’: ‘[Server Variable]’, // Product category – Type: string

‘brand’: ‘[Server Variable]’, // Product brand – Type: string

‘variant’: ‘[Server Variable]’, // Variant of the product like: color, size etc – Type: string

‘position’: [Server Variable] // Product position in a list – Type: numeric Example: 10

}

Following are the properties of productFieldObject:

  1. id
  2. name
  3. category
  4. brand
  5. variant
  6. price
  7. quantity
  8. coupon
  9. position

#3 ga(‘ec:setAction’, ‘click’, {list: ‘[LIST NAME]’}); – it is the enhanced ecommerce command which is used to measure click on a product link, in the product list (i.e. it measures product clicks)

Your developer has to write a server side script which send product click data whenever a product link is clicked in a product list.

The script should automatically populate the various fields (server variables) of your tracking code with the actual product data.

The ‘onProductClick’ function can be tied via online Javascript event handler ‘onClick’ like the one below:

<a href=”/tops/figber/” onClick=”onProductClick();”><img src=”/prod/figber.jpg”></a>

The complete code may look like the one below:

 

#5 Measuring Product Details View

In the purchase journey the user can view the product details page.

Add the following code on each product details page:

Here,

#1 ga(‘ec:addProduct’,productFieldObject); is the enhanced ecommerce command which is used to collect and store all product data (other than product impression data).

#2 ga(‘ec:setAction’, ‘detail’); – it is the enhanced ecommerce command which is used to measure product details page views

Your developer write a script which populate the various fields (server variables) of your tracking code with the actual product data.

 

 

#6 Measuring addition of a product(s) to a Shopping Cart

In the purchase journey the user may decide to buy a product. So he can add the product to shopping cart.

Tie the following function via a Javascript event handler ‘onClick’ to the shopping cart ‘add’ button on each product detail page and on the checkout page:

Here,

ga(‘ec:setAction’, ‘add’); – is the enhanced ecommerce command which is used to measure product add to cart.

Your developer write a script which populate the various fields (server variables) of your tracking code with the actual product data.

The ‘addToCart’ function can be tied via online Javascript event handler ‘onClick’ like the one below:

<button onclick=”addToCart(product);”>Add to Cart</button>

The complete code may look like the one below:

 

 

#7 Measuring removal of a product(s) from a Shopping Cart

In the purchase journey the user may decide not to buy a certain product. So he can remove the product from his shopping cart.

Tie the following function via the Javascript event handler ‘onClick’ to the shopping cart ‘remove’ button on each product detail page and on the checkout page:

Here,

ga(‘ec:setAction’, ‘remove’); – is the enhanced ecommerce command which is used to measure product remove from cart.

Your developer write a script which populate the various fields (server variables) of your tracking code with the actual product data.

The ‘removeFromCart’ function can be tied via online Javascript event handler ‘onClick’ like the one below:

<button onclick=”removeFromCart(product);”>Remove from Cart</button>

The complete code may look like the one below:

 

#8 Measuring the first Checkout Step

In the purchase journey the user may decide to start the checkout process and complete the various steps in the process.

In order to measure the first checkout step, use ec:addProduct command for each product added to the shopping cart and the ec:setAction command. Set the action type to ‘checkout’ and ‘step field’ to the step number.

Tie the following function via the Javascript event handler ‘onClick’ to the ‘checkout’ button:

Here,

ga(‘ec:setAction’,’checkout’, {‘step’: 1}); – is the enhanced ecommerce command which is used to measure the first step of the checkout process.

The ‘checkout’ function can be tied via online Javascript event handler ‘onClick’ like the one below:

<button onclick=”checkout(cart);”>Checkout</button>

The complete code may look like the one below:

 

 

#9 Measuring the second and subsequent Checkout Steps

In order to measure individual checkout steps, use ec:addProduct command for each product added to the shopping cart and the ec:setAction command.

Set the action type to ‘checkout’ and ‘step field’ to the step number.

To measure the second step of the checkout process:

use ec:addProduct for each product added to the shopping cart
use ga(‘ec:setAction’,’checkout’, {‘step’: 2});

Similarly,

To measure the third step of the checkout process:

use ec:addProduct for each product added to the shopping cart
use ga(‘ec:setAction’,’checkout’, {‘step’: 3});

Tie the following function via the Javascript event handler ‘onClick’ to each button which takes a user to the next checkout step:

The ‘checkout’ function can be tied via online Javascript event handler ‘onClick’ like the one below:

<button onclick=”checkout(cart);”>Continue</button>

The complete code may look like the one below:

Note: If your checkout process contains only a single step or if you have not configured enhanced ecommerce checkout funnel settings in your web property then measuring the individual checkout steps is not required.

 

#10 Measuring the checkout options

If you have measured a checkout step during the initial pageview but additional information about the same checkout step becomes available after a user has selected an option (like payment method) then you need to tie the following function via the Javascript event handler ‘onClick’ to the button(s) which takes a user to the next checkout step:

For example:

// Called when user selects a payment option.
function onPaymentSelection(stepNumber, optionSelected) {
ga(‘ec:setAction’, ‘checkout_option’, {
‘step’: 2,
‘option’:’visa’
});

ga(‘send’, ‘event’, ‘enhanced ecommerce’, ‘checkout_option’, ‘visa’,2);
}

The ‘onPaymentSelection’ function can be tied to the button(s) which takes a user to the next checkout step, like the one below:

<a href=”/next-page.html” onclick=”onPaymentSelection(2, ‘visa’); return !ga.loaded;”>Continue</a>

The complete code may look like the one below:

Note: Not every checkout process need checkout option.

 

#11 Measuring purchase

In the purchase journey the user complete the checkout process by making a purchase.

In order to measure transaction, use ec:addProduct for each product and the ec:setAction command with action type set to ‘purchase’.

Use the following tracking code on the order confirmation page:

 

 

#12 Measuring refund

Once the purchase journey is over, the user may ask for a refund.

You can provide either full refund or partial refund. Full refund means refunding the entire order. Whereas partial refund means refunding a part of the order like refunding a single product.

In order to measure the impact of refund on your business bottomline, you first need to import the refund data to your GA property.

You can import refund data either manually using the ‘Data import’ feature of Google Analytics or through Management API.

Once you have uploaded refund data you can see it, in your ‘Sales Performance Report’.

Note: You cannot delete or modify refund data once it has been uploaded to a web property. So double check the validity of the refund data before you upload it.

 

To measure an entire transaction use the following enhanced ecommerce command:

ga(‘ec:setAction’, ‘refund’, actionFieldObject);

and provide the transaction ID in the actionFieldObject.

For example:

The complete code for full refund may look like the one below:

Note: The refund hit will be sent only when a matching transaction is found.

 

To measure a partial refund use the following enhanced ecommerce commands:

ga(‘ec:addProduct’,productFieldObject);
ga(‘ec:setAction’, ‘refund’, actionFieldObject);

Provide product ID and product quantity in the productFieldObject.

Provide the transaction ID in the actionFieldObject.
For example:

The complete code for partial refund may look like the one below:

 

Enhanced Ecommerce Commands

Following is list of various enhanced ecommerce commands which we used while setting up enhanced ecommerce tracking, for quick reference:

#1 ga(‘require’, ‘ec’); is a Google Analytics command which is used to load the enhanced ecommerce plugin.

#2 ga(‘ec:addPromo’,promoFieldObject); is the enhanced ecommerce command which is used to collect and store impression data of an internal promotion campaign.This command is made up of:

#2.1 ec:addPromo – it is a Google Analytics command which is used to measure internal promotion impressions and send the impression data to promoFieldObject

#2.2 promoFieldObject – it is a JavaScript object which is used to store impression data of internal promotion campaigns.

 

#3 ga(‘ec:setAction’, <action-type>,actionFieldObject); – This enhanced ecommerce command is used to collect and store data related to enhanced ecommerce action.

This command is made up of:

#3.1 ec:setAction – it is a google analytics command which is used to measure ecommerce action data and then send the data to actionFieldObject.

#3.2 <action-type> – it denotes following ecommerce user actions:

promo_click’ – For example: ga(‘ec:setAction’, ‘promo_click’); // measure clicks on an internal promotion

detail’- For example: ga(‘ec:setAction’, ‘detail’); // product detail views

add’ – For example: ga(‘ec:setAction’, ‘add’); // measure Product Add to Cart.

remove’ – For example: ga(‘ec:setAction’, ‘remove’); // measure Product remove from Cart

checkout‘ – For example: ga(‘ec:setAction’,’checkout’, {‘option’: ‘visa’}); // measure additional information about a checkout step

purchase’ – For example: ga(‘ec:setAction’, ‘purchase’,{…}); // measure a purchase.

refund’ – For example: ga(‘ec:setAction’, ‘promo_click’); //measure the refund of one or more products.

#3.3 actionFieldObject – it is a JavaScript object which is used to store ecommerce action data. 

 

#4 ga(‘ec:addImpression’,impressionFieldObject); is the enhanced ecommerce command which is used to collect and store product impression data. This command is made up of:

#4.1 ec:addImpression – it is a Google Analytics command which measures product impressions and send the impression data to impressionFieldObject

#4.2 impressionFieldObject – it is a JavaScript object which is used to store product impression data.

 

#5 ga(‘ec:addProduct’,productFieldObject); is the enhanced ecommerce command which is used to collect and store all product data (other than product impression data). This command is made up of:

#1 ec:addProduct – it is a Google Analytics command which collect/measures all product data (other than product impression data) and then send the product data to productFieldObject.

#2 productFieldObject – it is a JavaScript object which is used to store all product data (other than product impression data). Data for following type of products is stored in this JavaScript object:

  1. Individual products that were viewed in a product list (product
  2. Products whose detail pages were viewed
  3. Products added to the shopping cart
  4. Products removed from shopping cart
  5. Products at each step of the checkout process
  6. Products that are purchased
  7. Products that are part of a refund.

 

Follow the steps below to implement enhanced ecommerce tracking on your website:

Step-1: Upgrade to Universal Analytics

This step is required only when you are still using the classic Google Analytics (ga.js). The upgrade is required because classic Google Analytics does not support enhanced ecommerce tracking.

Read this article for the upgrade: Universal Analytics Upgrade Guide

 

Step-2: Add the required enhanced ecommerce tracking code

Add the required enhanced ecommerce tracking code on various webpages of your website (as mentioned in this article) to track the most important shopping activities.

Note: Do not add the tracking code to measure product purchases at this stage. This is because, you can’t run enhanced ecommerce tracking in parallel with the traditional ecommerce tracking for the same web property and you don’t want to lose ecommerce data while you setup and test enhanced ecommerce tracking:

However, If you are setting up ecommerce tracking for the first time on your website, then you can also add the tracking code to measure product purchases at this stage.

 

Step-3: Enable enhanced ecommerce and configure Checkout steps name

Go to Admin section of your GA property, click on ‘Ecommerce Settings’, ‘Enable Ecommerce’ and then on ‘Enhance Ecommerce Reporting’:

enable ecommerce

Give descriptive name to each step in your checkout funnel:

checkout funnel steps

Note: if you don’t configure the checkout steps names then you will see only a single step called step 1 in your ‘Checkout behaviour Analysis’ report which is a good option only when you have got a single step checkout:

single step checkout

checkout steps configured

Once you have enabled ‘enhanced ecommerce reporting, you can see the new enhanced ecommerce tracking reports (under Conversions > Ecommerce in your GA view):

ecommerce reports

Note: It is important that you enable the enhanced ecommerce tracking via the reporting interface only when you are ready to test your enhanced ecommerce tracking code.

 

Step-4: Replace the old ecommerce tracking code with the product purchase tracking code

Once you have replaced the old ecommerce tracking  code with the product purchase tracking code on the order confirmation page, the old ecommerce tracking will be replaced by enhanced ecommerce tracking.

If you want to play super safe, then first deploy enhanced ecommerce tracking on your staging website via GA test property. You may need to use multiple trackers here. And when everything looks great, then deploy the enhanced ecommerce tracking code on the live website via your main GA property.

Other Articles on Enhanced Ecommerce Tracking

#1 Understanding Enhanced Ecommerce tracking in Google Analytics

#2 Using Enhanced E-Commerce segments for Remarketing in Google Analytics

#3 Using Cohort Analysis & Enhanced ecommerce to understand users behavior

#4 Fixing Duplicate, Cancelled, Test orders & Refunds in Google Analytics

#5 Enhanced Ecommerce Tracking via Google Tag Manager

Announcement about my new books

Maths and Stats for Web Analytics and Conversion Optimization
This expert guide will teach you how to leverage the knowledge of maths and statistics in order to accurately interpret data and take actions, which can quickly improve the bottom-line of your online business.

Master the Essentials of Email Marketing Analytics
This book focuses solely on the ‘analytics’ that power your email marketing optimization program and will help you dramatically reduce your cost per acquisition and increase marketing ROI by tracking the performance of the various KPIs and metrics used for email marketing.

Attribution Modelling in Google Analytics and Beyond
Attribution modelling is the process of determining the most effective marketing channels for investment. This book has been written to help you implement attribution modelling. It will teach you how to leverage the knowledge of attribution modelling in order to allocate marketing budget and understand buying behaviour.

Himanshu Sharma

Certified web analyst and founder of OptimizeSmart.com

My name is Himanshu Sharma and I help businesses find and fix their Google Analytics and conversion issues. If you have any questions or comments please contact me.

  • Over eleven years' experience in SEO, PPC and web analytics
  • Google Analytics certified
  • Google AdWords certified
  • Nominated for Digital Analytics Association Award for Excellence
  • Bachelors degree in Internet Science
  • Founder of OptimizeSmart.com and EventEducation.com

I am also the author of three books:

error: Content is protected !!