In this post, I am Going to show you guys, how to add Google Adwords Conversion Tracking and Google Analytics Ecommerce Tracking in uCommerce using only admin panel(dashboard) as well as through Tag Manager.
So here begins….
Here I have Created Multiple steps to make it easy to understand about implementation of tracking code.
//fetching order details
var orderid = order.OrderNumber;
var total = String.Format("{0:0.00}", order.OrderTotal).Replace(",", ".");
var tax = String.Format("{0:0.00}", order.VAT).Replace(",", ".");
var shipping = String.Format("{0:0.00}", order.ShippingTotal).Replace(",", ".");
var city = order.BillingAddress.City;
var state = order.BillingAddress.State;
var country = order.BillingAddress.Country.Name;//Google Adwords Conversion Tracking code
var conversionID = "ID HERE";
var conversionLabel = "Conversion label";
var conversionCurrency="Currency Code";
<!-- Google Code for OrderCompleted Conversion Page -->
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = @conversionID;
var google_conversion_language = "en";
var google_conversion_format = "2";
var google_conversion_color = "ffffff";
var google_conversion_label = "@conversionLabel";
var google_conversion_value = @total;
var google_conversion_currency = "@conversionCurrency";
var google_remarketing_only = false;
/* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//www.googleadservices.com/pagead/conversion/@conversionID/?value=@total¤cy_code=@conversionCurrency&label=@conversionLabel&guid=ON&script=0"/>
</div>
</noscript>// Google analytics Ecommerce tracking setup using universal google analytics
<script type="text/javascript">
ga('require', 'ecommerce', 'ecommerce.js');
ga('ecommerce:addTransaction', {
id: '@orderid', // Transaction ID - this is normally generated by your system.
affiliation: 'your store name', // Affiliation or store name
revenue: @total, // Grand Total
shipping: @shipping , // Shipping cost
tax: @tax // Tax.
});
@foreach (OrderLine orderline in order.OrderLines)
{
string lineSku = string.IsNullOrEmpty(orderline.VariantSku) ? orderline.Sku : orderline.VariantSku;
<text>
ga('ecommerce:addItem', {
id: '@orderid', // Transaction ID.
sku: '@lineSku', // SKU/code.
name: '@orderline.ProductName', // Product name.
category: '@string.Empty', // Category or variation.
price: @orderline.Price.ToString("N").Replace(",", "."), // Unit price.
quantity: @orderline.Quantity // Quantity.
});
</text>
}
ga('ecommerce:send');
</script>// Google analytics Ecommerce tracking setup using Asynchronous google analytics
<script type="text/javascript">
_gaq.push(['_addTrans',
'@orderid', // order ID - required
'your store name', // affiliation or store -
'@total',// total - required. Bemærk decimaladskiller er .
'@tax', // tax/Moms
'@shipping',// shipping -
'@city', // city
'@state',// state or province -
'@country'// country
]);
@foreach (OrderLine orderline in order.OrderLines)
{
string lineSku = string.IsNullOrEmpty(orderline.VariantSku) ? orderline.Sku : orderline.VariantSku;
<text>
_gaq.push(['_addItem',
'@orderid', // order ID - necessary to associate item with transaction
'@lineSku', // SKU/code – required
'@orderline.ProductName', // product name - required
'@string.Empty', // category
'@orderline.Price.ToString("N").Replace(",", ".")', // unit price - required
'@orderline.Quantity' // quantity - required
])
;
</text>
}
_gaq.push(['_trackTrans']);
</script>//Google Adwords Conversion Tracking code (GTM-dataLayer)
var conversionCurrency="Currency Code";
<script type="text/javascript">
var dataLayer=window.dataLayer||[];
dataLayer.push({'event':'google_conversion','totalVal':'@total','conversionCurrency':'@conversionCurrency'});
</script>Now we have to trigger Adwords Conversion Code through GTM on ‘google_conversion‘ event and to set conversion value and currency, you have create 2 dataLayer variable i.e totalVal and conversionCurrency and set it to conversion tag.
<script>
window.dataLayer = window.dataLayer || [];
var transProductDetails=[];
@foreach (OrderLine orderline in order.OrderLines)
{
string lineSku = string.IsNullOrEmpty(orderline.VariantSku) ? orderline.Sku : orderline.VariantSku;
<text>
var transProduct={
'sku': '@lineSku',
'name': '@orderline.ProductName',
'category': '@string.Empty',
'price': @orderline.Price.ToString("N").Replace(",", "."),
'quantity': @orderline.Quantity
};
transProductDetails.push(transProduct);
</text>
}
dataLayer.push({
'event':'ecommerceTrackEvent',
'transactionId': '@orderid',
'transactionAffiliation': 'your store name',
'transactionTotal': @total,
'transactionTax': @tax,
'transactionShipping': @shipping,
'transactionProducts': transProductDetails
});
</script>Now you have to trigger Google Analytics Tracking through GTM on ‘ecommerceTrackEvent’ event.
Since this blog is getting lengthy, so I will write some more blog on Conversion Tracking and Analytics Ecommerce Tracking through GTM. But for now I am taking break.
If you have any query kindly leave your comment below or you can contact us by get in touch.
See you again… Have a good day ahead with lots of fun…
In this blog, you will see how to add Adwords Conversion Tracking and Remarkeing Code in BigCommerce.BigCommerce is one of…
Around 6 months back, I had published an article on “How to add GA e-commerce tracking in Opencart“. I am really thankful…
If you have gone through our previous blog about Google Analytics, you might have sound understanding about Google Analytics and how it…
Do you want to know more about your visitors and how your content is performing? Whether you run a website…
In this blog, you will see how to add Google Analytics and E-commerce Tracking Code in BigCommerce. BigCommerce is one of the…
If you have gone through some of previous blog, you might have seen how to install google analytics, e-commerce tracking…