Enhanced E-comerce and eCommerce Tracking for OpenCart using Google Tag Manager

Standard

Are you looking to implement Enhanced Ecommerce and eCommerce Tracking for OpenCart using Google Tag Manager using Javascript without making any change on the openCart.

Recently once client want to implement e-commerce tracking without any plugin or without making changes on the website and challenges accepted and implemented through Google Tag Manager.

Google Analytics Improved Enhanced Ecommerce enable sales information,product impression, promotion, sales data to be sent with any of occasions and your Google Analytics pageviews. Use pageviews to monitor product purchases and product impressions, and use occasions to monitor product clicks and checkout measures.

What is Enhanced E-commerce Tracking for OpenCart using Google Tag Manager?

Because Opencart is an Ajax website, I decided to implement through Using a Custom JavaScript Macro

opencart google analytics ecommerce tracking

Custom Javascritp opencart analytics ecommerce tracking

To Implement Enhanced Ecommerce Tracking OpenCart using Google Tag Manager

  1. First Install Google Tag Manager on Your OpenCart for Set Up E-commerce Tracking using Google Tag Manager without touch Code of OpenCart
Paste this code as high in the <head> of the page as possible:
<!– Google Tag Manager –>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXX’);</script>
<!– End Google Tag Manager –>
Additionally, paste this code immediately after the opening <body> tag:
<!– Google Tag Manager (noscript) –>
<noscript><iframe src=”https://www.googletagmanager.com/ns.html?id=GTM-XXXX”
height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
<!– End Google Tag Manager (noscript) –>

Note: Make you will replace GTM Tracking Code with your GTM ID XXXXX

2. Product Detail Impressions: To Track product impression for OpenCart E-commerce and Enhanced E-commerce Tracking using Google Tag Manager used custom javascript to get the value of price, product and brand etc

Implementation of Google Tag Manager in OpenCart

Ecommerce Tracking through Google Tag Manager to Opencart

2.  Add to Cart: To measure additions add to Cart Product added for OpenCart Enhanced Ecommerce Tracking using Google Tag Manager used custom javascript to get the value of price, product and brand etc

eCommerce Tracking for OpenCart

Opencart Enhance Ecommerce with Google Tag Manager

3.  Measuring Checkout Steps: To measure Checkout Steps that will tell us , How many people reach to till checkout and drop out and went till another step for Opencart Enhanced Ecommerce with Google Tag Manager

OpenCart Google Tag Manager Ecommerce Tracking

Google Tag Manager Ecommerce Tracking on Opencart