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:
id
name
creative
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:
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:
‘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 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:
id
affiliation
revenue
tax
shipping
coupon
list
step
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:
id
name
category
brand
variant
list
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:
Individual products that were viewed in a product list (product
Products whose detail pages were viewed
Products added to the shopping cart
Products removed from shopping cart
Products at each step of the checkout process
Products that are purchased
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:
id
name
category
brand
variant
price
quantity
coupon
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:
// Refund an entire transaction.
ga('ec:setAction',