Categories: Adword Conversion TrackingGoogle Analytics and Ecommerce Tracking

Conversion and E-commerce Tracking in uCommerce

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….

Steps to add Tracking Code in uCommerce:

Here I have Created Multiple steps to make it easy to understand about implementation of tracking code.

  • Login to dashboard.
  • Go to OrderApproved page (the page the user gets redirected to,  after the payment).
  • Add below Code to fetch order details.
//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;
  • Now we will add Tracking code in order confirmation/order approved page (only through dashboard):

To add Conversion Tracking Code.

//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&currency_code=@conversionCurrency&label=@conversionLabel&guid=ON&script=0"/>
    </div>
</noscript>

To add Google Analytics Ecommerce Tracking (universal Analytics):

// 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>

To add Google Analytics Ecommerce Tracking (Asynchronous Analytics):

// 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>
  • If you want to add/trigger above tracking code through Google Tag Manager, skip Step 4.
    In this case we have to add some different Type of code in orderApproved page(order Conversion Code).But for this you must have access to your Google Tag Manager (GTM), as well as GTM container code must be available on you website. if you have required access then we can go further.

To add Adwords Conversion Tracking Code(pass order total and currency value to GTM):

//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.

To add Google Analytics Ecommerce Tracking Code( pass complete order details to GTM in a google prescribed format).

<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…

Notes On Click

Share
Published by
Notes On Click

Recent Posts

  • Adword Conversion Tracking
  • Google Adwords Remarketing

Conversion and Remaketing code in BigCommerce

In this blog, you will see how to add Adwords Conversion Tracking and Remarkeing Code in BigCommerce.BigCommerce is one of…

8 years ago
  • Google Analytics and Ecommerce Tracking

Ecommerce Tracking in OpenCart 2.3

Around 6 months back, I had published an article on “How to add GA e-commerce tracking in Opencart“. I am really thankful…

8 years ago
  • Google Analytics and Ecommerce Tracking

Google Analytics Definition and Common Terms

 If you have gone through our previous blog about Google Analytics, you might have sound understanding about Google Analytics and how it…

8 years ago
  • Google Analytics and Ecommerce Tracking

What is Google Analytics and it’s Features?

Do you want to know more about your visitors and how your content is performing?​ Whether you run a website…

8 years ago
  • Google Analytics and Ecommerce Tracking

How to Add Google Analytics in BigCommerce

In this blog, you will see how to add Google Analytics and E-commerce Tracking Code  in BigCommerce. BigCommerce is one of the…

8 years ago
  • Google Analytics and Ecommerce Tracking

Google Analytics and E-commerce Tracking in Miva Merchant

If you have gone through some of previous blog, you might have seen how to install google analytics, e-commerce tracking…

8 years ago