Skip to main content
All CollectionsSales TrackingJavascript Tracking
Javascript Postback Tracking for Shopify
Javascript Postback Tracking for Shopify

How to implement Aspire's Javascript Postback Tracking for Shopify websites

Heather Clark avatar
Written by Heather Clark
Updated over 3 months ago

Overview

Aspire's Javascript Postback Tracking is a privacy-compliant tracking method that offers client-side functionality for session storage and conversions with minimal setup effort.

This article will walk you through the steps of configuring your Link Tracking Offer and adding Aspire's Javascript SDK codes to your Shopify store to record sessions and post conversions. This guide is applicable to all Shopify stores, regardless of plan type.

Important Considerations:

Directions

Step 1: Recording Clicks

To record a click and start a session when a user arrives at a product or landing page, you must add a simple code snippet to the master template.

  1. Navigate to the theme.liquid master template by selecting Themes under Online Store, then clicking on the ellipsis icon (…) and selecting Edit code.

  2. Select theme.liquid in the menu on the left under Layout and you will see something like this.

  3. Paste the following tracking snippet at the top of the file right below the first <head> tag:

    <script> 

    !function(){var o=window.tdl=window.tdl||[];if(o.invoked)window.console&&console.error&&console.error("Tune snippet has been included more than once.");else{o.invoked=!0,o.methods=["init","identify","convert"],o.factory=function(n){return function(){var e=Array.prototype.slice.call(arguments);return e.unshift(n),o.push(e),o}};for(var e=0;e<o.methods.length;e++){var n=o.methods[e];o[n]=o.factory(n)}o.init=function(e){var n=document.createElement("script");n.type="text/javascript",n.async=!0,n.src="https://js.go2sdk.com/v2/tune.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(n,t),o.domain=e}}}();

    tdl.init("https://aspireiq.go2cloud.org")
    tdl.identify()
    </script>

Once you save the file, the tracking snippet will be applied to all your Shopify pages and you are ready to start recording clicks!


Step 2: Recording Conversions on Checkout

To record a conversion when a user successfully checks out, a second snippet must be added.

  1. Go to your Shopify store settings and select Customer Events, then click Add Custom Pixel.

  2. Enter a pixel name, such as "Aspire Javascript", then click Add Pixel. In the Code area, remove the placeholder text, then enter the following code.

    !function(){
    var o = window.tdl = window.tdl || [];
    if (o.invoked) window.console && console.error && console.error("Tune snippet has been included more than once.");
    else {
    o.invoked = !0;
    o.methods = ["init", "identify", "convert"];
    o.factory = function(n){
    return function(){
    var e = Array.prototype.slice.call(arguments);
    e.unshift(n), o.push(e), o
    }
    };
    for(var e = 0; e < o.methods.length; e++){
    var n = o.methods[e];
    o[n] = o.factory(n)
    }
    o.init = function(e){
    var n = document.createElement("script");
    n.type = "text/javascript", n.async = !0;
    n.src = "https://js.go2sdk.com/v2/tune.js";
    var t = document.getElementsByTagName("script")[0];
    t.parentNode.insertBefore(n, t), o.domain = e
    }
    }
    }();


    tdl.init("https://aspireiq.go2cloud.org")
    analytics.subscribe('checkout_completed', (event) => {
    async function convertToUSD(currencyCodeFrom, amount) {
    // Documentation for this API: https://exchangeratesapi.io/documentation/
    const EXCHANGE_RATES_API_KEY = 'YOUR API KEY HERE';
    const response = await fetch(
    `https://api.exchangeratesapi.io/v1/convert?access_key=${EXCHANGE_RATES_API_KEY}&from=${currencyCodeFrom}&to=USD&amount=${amount}`,
    { method: "GET" }
    );
    const result = await response.json();
    return result.result;
    }

    async function recordConversion(){
    const cartSubtotalCurrencyCode = event.data.checkout.subtotalPrice.currencyCode;
    let cartSubtotal = event.data.checkout.subtotalPrice.amount;
    let cartSubtotalUSD = cartSubtotal;

    if (cartSubtotalCurrencyCode !== "USD") {
    try {
    cartSubtotalUSD = await convertToUSD(
    cartSubtotalCurrencyCode,
    cartSubtotal
    );
    console.log({cartSubtotalUSD})
    } catch (error) {
    cartSubtotalUSD = 0;
    console.error("Error when converting cart subtotal to USD", error);
    }
    }
    tdl.convert({
    'amount': cartSubtotalUSD,
    'adv_unique1': event.data.checkout.order.id,
    });
    }
    recordConversion()
    });

  3. Click Save in the top banner, then click Connect.


Step 3: Configure Your Offer & Place a Test Order

The final step is to configure your Link Tracking Offer within your Aspire account, then place a test order.

Go to Reporting > Sales Tracking to create a new Link Tracking Offer or configure an existing one. Within your Offer settings, there are two main requirements:

  1. Under Conversion & Tracking, the "Conversion Tracking" method must be set to Javascript Postback.

  2. Within the Offer URL Tracking, you must append transaction_id={transaction_id} to the end of the URL.

    For example, if you're directing traffic to: https://brand.com/shop

    You'll want to ensure the transaction_id is being appended like so: https://brand.com/shop?transaction_id={transaction_id}

Once you've created an offer, we highly recommend placing a test order before generating links for your members to confirm that clicks and conversions are being tracked properly.


Multiple Currency Support

Within the Javascript code provided in Step 2, there is a section that references Exchange Rates API, which is used to convert non-USD sale amounts to USD.

If your Shopify store accepts non-USD currencies, you need to use an exchange rate API to convert the sale amounts to USD. In order to utilize the Javascript code provided in this article, you must subscribe to a paid plan through Exchange Rates API (see their pricing plans here). Their Basic plan provides up to 10,000 API requests per month and supports all base currencies.

Once you have subscribed to Exchange Rates API, please be sure to fill in the placeholder value with your API key before using the Javascript code in Step 2, as instructed below:

  • Enter your Exchange Rates API key in the placeholder value YOUR API KEY HERE in the snippet below:
    const EXCHANGE_RATES_API_KEY = 'YOUR API KEY HERE';

If you are using a different exchange rate API, the Javascript code provided in this article will need to be modified to reference the API that you are using.


Domain Support

Aspire's Javascript Tracking only supports same-site and cross-origin conversions at this time. Meaning if the domain on the landing page is different than the domain on the checkout page (and it is not a sub-domain), we will not be able to track the conversions. See below for examples.

Supported

1. Single custom Shopify domain

  • Landing page: mystorename.com/landing

  • Checkout page: mystorename.com/checkout

2. Custom domain with sub-domains

  • Landing page: mystorename.com

  • Checkout page: checkout.mystorename.com

Not Supported

1. Default free Shopify domain

  • Landing page: mystorename.myshopify.com

  • Checkout page: checkout.shopify.com

2. Multiple custom Shopify domains

  • Landing page: mystorename.com

  • Checkout page: mycheckoutpage.com


Frequently Asked Questions

Is this a one-time setup or something we'll need to complete for each Link Tracking Offer we create?

This is a one-time setup process.

Can we use Javascript Tracking if we have multiple Shopify stores?

Yes! While redirecting from one store to other, the redirect link should contain transaction_id=TRANSACTION_ID so that the Javascript Postback on the next store can gather the Transaction ID. You can fetch the TRANSACTION_ID value from Session Storage.

Does Aspire use first click or last click attribution?

We use last click attribution. If two members refer a sale, the last member to refer the user to the conversion page will receive the credit.

What is the conversion window for Javascript tracking?

The default conversion window is 30 days. This is how long a session starting on click can last and still be converted on.

Please note that Apple’s Safari browser deletes all first-party cookies and other script-writable storage after 7 days without user interaction. This means the conversion window on Apple devices will be capped at one week.

What Shopify store permissions are required to complete this setup?

For Step 1, you will need the permission "Edit code" to modify the theme code directly through the code editor.

For Step 2, you will need the permission "View customer events" to view customer events, including custom pixels.

Did this answer your question?