• 10.0.0 - 10.0.26
    541 201 9965 Email Website
  • Contents
    Search:
     

    Home > Setup & Configuration > Google Analytics E-commerce Tracking

    Google Analytics E-commerce Tracking

    AspDotNetStorefront supports asynchronous e-commerce tracking using Universal Analytics (analytics.js). This version of Google Analytics in AspDotNetStorefront allows you to make modifications to the Google Analytics code without modifying core source code.

    To use this latest analytics code, your Google account will need to be set for Universal Analytics. To check the status of your GA account (Universal or Classic), you can check which JavaScript Library your tracking code is referencing. To do so, login to your Google Analytics account and click Tracking Code to see the tracking code snippet for a specific property. Look for ga.js or analytics.js referenced somewhere in the code. Classic Google Analytics properties reference ga.js and Universal Analytics properties reference analytics.js.

    If your account requires upgrading, follow Step 1 in this guide.
    If you do not see the upgrade option, review this information.

    FOR VERSIONS 10.0.23+ Google Enhanced Ecommerce is now integrated.

    Google Analytics

    Configuration

    First you will need your Google Analytics account number. You can find this code by logging into your Google Analytics account. The interface on Google Analytics changes frequently but you should find the number on the page where you get your tracking script. Copy the UA-xxxxxxxx-x number from this page.

     

    Once you've got the UA number, navigate to your admin console  and add the account number to the SettingGoogle.AnalyticsAccount.

     

    Lastly, make sure that the SettingUseLiveTansactions is set to Yes. This setting assures that Google Analytics only runs on your live website.

    At this point you have completed the installation of Google Analytics. You should be able to view page source on the front end of your website and see the Google Analytics code.

      

    Google Analytics Ecommerce Tracking

    If you would like to enable ecommerce tracking you just have two more steps to complete.

    First, login to your Google Analytics account and enable e-commerce tracking. The interface tends to change, but look under ADMIN(tab) > View > Ecommerce Settings.

     

    Next,  log in to the admin console and set the Setting: Google.EcomOrderTrackingEnabled to Yes.

    That's it! At this point your site will send order data up to Google Analytics when your customers check out.

    Google Display Advertising

    To enable Google Display Advertising in the tracking code, set SettingGoogle.AnalyticsDisplayAdvertising.Enabled to Yes.

    When this is set to Yes, it will include the following line in your analytics javascript: ga('require', 'displayfeatures');

     

    Google Enhanced Ecommerce (10.0.23+)

    Google Analytics Enhanced Ecommerce is an official plugin for Google Analytics which tracks product impressions, clicks and add-to-carts, from both product and entity pages. It also includes tracking for searches, checkout, and order completion. This uses Google's modern "analytics.js" plugin.

    Setup

    Google Analytics Account

    • Select the correct Analytics Account from the dropdown in your Google Analytics account
    • Go Admin ->(View column) - Ecommerce Settings
    • Set Enable Ecommerce to TRUE and Enable Enhanced Ecommerce to TRUE

    Admin Console Configurations

    • Google.AnalyticsAccount - Required for both Google Analytics Ecommerce Tracking and Enhanced Ecommerce, it takes the form "UA-XXXXX-Y".
    • UseLiveTransactions - Should be true to prevent Analytics data being logged from a test site.
    • Google.EcomOrderTrackingEnabled - Enables Google Analytics Ecommerce tracking on order completion. Before setting to true, set Google.EnhancedEcommerce.Enabled to false.
    • Google.EnhancedEcommerce.Enabled - Enables Google Enhanced Ecommerce. Before setting to true, set Google.EcomOrderTrackingEnabled to false.
    • Google.EnhancedEcommerce.ImpressionClickTracking.Enabled - If set to true, this enables tracking on entity, search, and featured listing pages. It should be set to false if enabling it interferes with the usability of your site.
    • Vortx.DataLayer.Enabled - This setting must be true if using Google Analytics Enhanced Ecommerce. It defaults to false.

    Skin Merges Needed for Tracking

    If you have previously modified versions of Xml packages in your site prior to upgrading to 10.0.23+

    • Any XMLPackages in the below list of supported XMLPackages on which you want tracking
    • script.bodyclose.xml.config if you want tracking on the checkout page

    Supported XMLPackages

    These XMLPackages will need to be manually merged (such as using Beyond Compare or a knowledgeable developer) with new 10.0.23+ packages if they have been modified in order to allow Google Analytics Ecommerce Tracking or Enhanced Ecommerce to take effect.

    • entity.grid.xml.config
    • entity.gridwithprices.xml.config
    • entity.simpleproductlist.xml.config
    • entity.tableorderform.xml.config
    • entitygridpage.xml.config
    • featuredproducts.xml.config
    • page.bestsellers.xml.config
    • page.kitheader.xml.config
    • page.recentadditions.xml.config
    • relatedproducts.xml.config
    • page.search.xml.config
    • page.searchadv.xml.config
    • product.SimpleProduct.xml.config
    • product.SimpleProductLargeImage.xml.config
    • product.tabbed-responsive.xml.config
    • product.TabbedUI.xml.config
    • product.TextbookFull.xml.config
    • product.VariantsInDropDown.xml.config
    • product.VariantsInGrid.xml.config
    • product.VariantsInRightBar.xml.config
    • upsellproducts.xml.config

    Updating Google Analytics to GA4

    Google Analytics can be upgraded to GA4 by using the Tag Manager setting and topic in the storefront, which is thrown on all pages (assuming the stock script.head.xml.config is still being called in your skin's _Head.cshtml file).

    NOTE: GA4 can run alongside basic Universal Google Analytics and Enhanced Ecommerce if desired.

     
    Step Overview:
    1. Follow the instructions for GA4 using the GA4 Setup Assistant

    2. After that, the objective is to get the gtag.js code onto every page.
      - This can be done using the existing Script.Google.TagManager topic and the Google.TagManager.Enabled setting.
      - Set Google.TagManager.Enabled = true
      - Edit the topic Script.Google.TagManager in the admin, click the HTML button, paste in the gtag code from Google Analytics.

    DETAILS:
    In Google Analytics, once you've upgraded your property to GA4 you get this window.
    Click the highlighted tag installation arrow:



    It takes you to your GA4 property.  Click on your property.
    On the next window, copy the gtag text circled below and paste it into your Script.Google.TagManager topic:


    Copy the gtag text into your Script.Google.TagManager topic, making sure to click the HTML button first.
    Save your topic.

    The data will take a while to show up in google analytics on your GA4 property.


    Actions
    Print This Article
    Bookmark
    Email This Article
    Previous Article
    Next Article