Track Ecommerce transaction with Google Tag Manager in Vb.net

Standard

Recently, one of the client has asked to implement e-commerce tracking on ASP.NET ( Vb.net) website using Google Tag Manager

E-commerce tracking is one of most challenging part to implement in ASP.NET (Vb.net)

E-Commerce tracking even allows you to see your conversions to improve. Doesn’t that sound thrilling? It is fairly easy to empower your site for creating such advice. All that you need is a couple of codes that are additional. Naturally, you even have to examine the information presented to make the most of it.Transaction data passed back by the payment gateway or is usually saved in your back end systems.

You have to pass this info to the script that is analytics. To put it differently, you will use a server side language like PHP write a JavaScript directly to the resultant HTML page and to get the data.

You can see this features set up ecommerce tracking using Google Tag Manager in .net website.

  • Transaction Revenue
  • Transaction Tax
  • Transaction Shipping
  • Item Revenue
  • Revenue per Transaction
  • Revenue per Visit
  • Total Value
  • Revenue per Item
    Implementing E-Commerce Tracking via Google Tag Manager

    E-Commerce Conversion Tracking Using Google Tag Manager

    Google Tag Manager eCommerce Tracking installation

    Google Tag Manager integration (GTM)

    Step 1. First Install Google Tag Manager on Your ASP.NET ( Vb.net) website for Setup E-commerce Tracking using Google Tag Manager

    Copy the code below and paste it onto every page of your website. Place it immediately after the opening <body> tag.

    <!– Google Tag Manager –>
    <noscript><iframe src=”//www.googletagmanager.com/ns.html?id=GTM-XXXXXX
    height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
    <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=
    ‘//www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,’script’,’dataLayer’,’GTM-XXXXXX‘);</script>
    <!– End Google Tag Manager –>

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

Step 2. Create a data layer using Custom HTML Tag 

<script type=”text/javascript”>

function read_cookie(name) {
var result = document.cookie.match(new RegExp(name + ‘=([^;]+)’));
result && (result = JSON.parse(result[1]));
return result;
}
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, “\\$&”);
var regex = new RegExp(“[?&]” + name + “(=([^&#]*)|&|#|$)”),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return ”;
return decodeURIComponent(results[2].replace(/\+/g, ” “));
}
var items = read_cookie(“ga_cart”);
var total = parseFloat(read_cookie(“ga_total”));
var products = [];
for (var i = 0; i < items.length; i++) {
var product = {
‘sku’ : items[i].TradingItem[“#text”],

 DataLayer In Custom JavaScript Variables

Google Tag Manager Data Layer ECommerce

Step 3. Create a data layer using Custom HTML Tag for Store

<script type=”text/javascript”>
function parseXML(val) {
if (document.implementation && document.implementation.createDocument) {
xmlDoc = new DOMParser().parseFromString(val, ‘text/xml’);
}
else if (window.ActiveXObject) {
xmlDoc = new ActiveXObject(“Microsoft.XMLDOM”);
xmlDoc.loadXML(val);
}
else
{
alert(‘Your browser cant handle this script’);
return null;
}
return xmlDoc;
}

function xmlToJson(xml) {

// Create the return object
var obj = {};

if (xml.nodeType == 1) { // element
// do attributes
if (xml.attributes.length > 0) {
obj[“@attributes”] = {};
for (var j = 0; j < xml.attributes.length; j++) {
var attribute = xml.attributes.item(j);
obj[“@attributes”][attribute.nodeName] = attribute.nodeValue;
}

Google Tag Manager E-commerce data Layer

Implement using the Data Layer

For Contact: mappchero@gmail.com

Warning:if you do n’t know about javascript or do n’t have developing knowledge then do n’t try to implement on ASP.NET () E-commerce  Setup using Google Tag Manager  that can broke your site, Cart and other functionality 

Disclaimer: Google tag manager belongs to Google property 

Volusion E-Commerce Conversion Tracking into Google Analytics using Google Tag Manager

Standard

Capturing Ecommerce Transaction Data Details On Your Volusion store in Google Analytic using Google Tag Manager

Recently I have worked one of client to implement e-commerce tracking on Volusion using Google Tag Manager.

Volusion E-commerce monitoring permits you to measure the number of transactions and sales that your website generates. Google Analytics that allows for you to monitor on-line transactions on e-commerce web sites. It presents specific analytical knowledge to help set up the proper route to maximum ROI.

Volusion E-Commerce tracking even allows you to see on-line traffic sources to enhance your conversions. It’s as a substitute simple to enable your website for generating such information. All you need is a couple of additional codes. Of path, you additionally have got to analyze the information presented to benefit from it.

What data you will get it form Implement E-commerce tracking in Volusion using Google Tag Manager?

  • Revenue from product sales from your volusion Store
  • Average order value from your volusion Store
  • Total transactions and product purchases from your volusion Store
  • Number of days/sessions before a transaction occurred from your volusion Store
  • Sales performance on particular dates from your volusion Store

Volusion Ecommerce Tracking using Google Tag Manager can be generated Transaction Data by JavaScript on the OrderFinished.asp page within your Volusion Store.

Volusion E-commerce Tracking Two type of JavaScript that help you to track E-commerce Sales using Google Tag Manager 

Volusion E-commerce Tracking using Google Tag Manager by Transaction Array Contents

  • Order[0] = Order ID
  • Order[1] = Unused
  • Order[2] = Payment Amount
  • Order[3] = Affiliate Commissionable Value
  • Order[4] = Sales Tax
  • Order[5] = Total Shipping Cost
  • Order[6] = Billing City
  • Order[7] = Billing State
  • Order[8] = Billing Country
  • Order[9] = Email Address

Volusion Ecommerce Tracking using Google Tag Manager by Order Details Array Contents

  • OrderDetails[X][0] = Order ID
  • OrderDetails[X][1] = Order Detail ID
  • OrderDetails[X][2] = Product Code
  • OrderDetails[X][3] = Product Name
  • OrderDetails[X][5] = Product Price
  • OrderDetails[X][6] = Quantity

Step 1. First Install Google Tag Manager on Your Volusion for Setup E-commerce Tracking using Google Tag Manager

Copy the code below and paste it onto every page of your website. Place it immediately after the opening <body> tag.

<!– Google Tag Manager –>
<noscript><iframe src=”//www.googletagmanager.com/ns.html?id=GTM-XXXXXX
height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
<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=
‘//www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXX‘);</script>
<!– End Google Tag Manager –>

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

Step 2. For Install Google Tag Manager in your Volution Store your admin area, got t to Design > File Editor in your Admin Area —->In the Live Edit page, click on your template.htm

Google Analytics Ecommerce Tracking On Volusion

Google Analytics Ecommerce Tracking On Volusion using Google Tag Manager

Step 3. E-commerce data layer code will be implemented in Volusion using Google Tag Manager to track Sales data in Google Analytic 

<!– Start – Volusion E-commerce Tracking Google Tag Manager Transaction Script  –>
<script>
dataLayer = [{
‘transactionId’: Order[0],
‘transactionAffiliation’: ‘smileherb’,
‘transactionTotal’: Order[2],
‘transactionTax’: Order[4],
‘transactionShipping’: Order[5]
}];
var transactionProducts = [];
for(var i=0;i<OrderDetails.length;i++) {
transactionProducts.push({
‘sku’: OrderDetails[i][2],
‘name’: OrderDetails[i][3],
‘category’: ‘none’,
‘price’: OrderDetails[i][5],
‘quantity’: OrderDetails[i][6]
})}
dataLayer.push({
    ‘transactionProducts’: transactionProducts
});
</script>
<!– End – Volusion E-commerce Tracking Google Tag Manager Transaction Script –>

Step 4. Now Configure Trigger , Tag and Event Triggers in Google Tag Manager for Volution E-commerce Tracking 

Installing Tracking Tag in Volusion

Google Analytics Ecommerce Tracking On Volusion

Step 5.  Now Create Google Tag Manager Custom Event to firing E-commerce Datalayer in Volusion Store in Google Tag Manager 

Setup Ecommerce custom event for Bigcommerce

Installing Tracking Tag in Volusion

Volusion E-commerce Tracking using Google Tag Manager – https://support.google.com/tagmanager/answer/6107169?hl=en

For Troubleshoot of Volution E-commerce tracking using Google Tag Manager –  Use Tag Assistance  – https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=en

For Contact: mappchero@gmail.com

Warning:if you do n’t know about javascript or do n’t have developing knowledge then do n’t try to implement on Volusion E-commerce tracking using Google Tag Manager  that can broke your site, Cart and other functionality 

Disclaimer: Google tag manager belongs to Google property 

I am avaible for Hire on Freelancer: Freelancer.com

I am avaible for Hire on Upwork: Upwork.com

I am avaible for Hire on Peopleperhour: Peopleperhour.com

I am avaible for Hire on Guru: Guru.com