Skip to main content

Setting Up JavaScript Sales Tracking for Non-Shopify Sites

Written by Iren

Introduction

HypeAuditor’s JavaScript Sales Tracking is a simple, privacy-conscious way to track sessions and conversions directly from a user’s browser — no third-party cookies needed. With just a few quick steps, you can ensure accurate tracking of clicks and purchases without any extra hassle.

In this guide, we’ll walk you through how to:

✅ Add the JavaScript tracking script to your website

✅ Track sessions when users land on your pages

✅ Capture conversions when they complete a purchase

Key things to know:

  • JavaScript Tracking currently supports both same-site and cross-origin conversions.

  • Running multiple currencies on your site? Check out our separate guide for details on currency tracking.

Step-by-step guide

Step 1: Track clicks and start sessions

To capture a click and initiate a session when a user lands on a product or landing page, insert the following code into the <head> section of your website:

!function(){"use strict";const t=window.haTracking=window.haTracking||[];t.invoked||(t.invoked=!0,t.methods=["identify","convert"],t.factory=function(n){return async function(){const e=Array.prototype.slice.call(arguments);return new Promise((function(c,o){t.push([n,e,c,o])}))}},t.methods.forEach((function(n){t[n]=t.factory(n)})),function(){const t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src="https://hatr.hypeauditor.com/hatr.iife.js",document.head.appendChild(t)}())}();

haTracking.identify()

This script does two key things:

  • The haTracking.identify() function is invoked to store or generate a user's session. This is akin to recording a "click" in traditional tracking methods.

  • This function extracts the transaction_id parameter from the URL's query string and saves it in the user's browser's local storage.

📌 Important: Add this script to all landing pages and product pages where users might enter your site to ensure session tracking works correctly. HypeAuditor can only track sessions on pages where the tdl.identify() method is active.

Step 2: Track conversions after checkout

Once a user completes a purchase, you’ll need to log the conversion using haTracking.convert().

Here’s the basic script you’ll need to add to your "Thank You" page (or any page confirming the transaction):

!function(){"use strict";const t=window.haTracking=window.haTracking||[];t.invoked||(t.invoked=!0,t.methods=["identify","convert"],t.factory=function(n){return async function(){const e=Array.prototype.slice.call(arguments);return new Promise((function(c,o){t.push([n,e,c,o])}))}},t.methods.forEach((function(n){t[n]=t.factory(n)})),function(){const t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src="https://hatr.feature.hypeauditor.dev/hatr.iife.js",document.head.appendChild(t)}())}();

haTracking.convert(totalPrice)

What this script does:

  • Calls haTracking.convert(), which retrieves the stored transaction ID and logs a conversion.

  • No need to manually pass transaction_id, as it’s already saved in the user’s browser.

Adding order ID

Want to track the order ID? Update haTracking.convert() like this:

a. If your campaign-level currency (i.e., the currency you’ve chosen when setting up your campaign in the HypeAuditor Campaign Management tool) is the same as your store currency:

 haTracking.convert(
totalPrice,
{
orderId: orderId,
currency: currency
}
);

b. If your campaign-level currency differs from your store currency:

    // https://exchangeratesapi.io/documentation/
const PREFERRED_CURRENCY_CODE = 'USD';
const EXCHANGE_RATES_API_KEY = 'YOUR_API_KEY_HERE';

async function convertToPreferredCurrency(currencyCodeFrom, amount) {
try {
const response = await fetch(
`https://api.exchangeratesapi.io/v1/convert?access_key=${EXCHANGE_RATES_API_KEY}&from=${currencyCodeFrom}&to=${PREFERRED_CURRENCY_CODE}&amount=${amount}`,
{ method: "GET" }
);

if (!response.ok) {
throw new Error(`API request failed with status ${response.status}`);
}

const result = await response.json();

return result.result;
} catch (error) {
console.error("Error converting currency:", error);
return null;
}
}

async function recordConversion() {
const cartTotalCurrencyCode = currencyCode;
const cartTotal = amount;
let convertedCartTotal = null;

if (PREFERRED_CURRENCY_CODE !== cartTotalCurrencyCode) {
convertedCartTotal = await convertToPreferredCurrency(cartTotalCurrencyCode, cartTotal);
}

haTracking.convert(
convertedCartTotal ?? cartTotal,
{
orderId: event.data.checkout.order.id,
currency: convertedCartTotal ? PREFERRED_CURRENCY_CODE : cartTotalCurrencyCode
}
);
}

recordConversion();

Breakdown of parameters

  • totalPrice: The total sale amount (e.g., '99.99').

  • orderId: The unique order ID (e.g., 'ORDER12345')

  • сurrency: The store currency (e.g., 'USD'). If your campaign currency differs from your store currency, you need to include currency conversion in the tracking code.

📌 Important: We do not guarantee the accuracy of exchange rates provided by any third-party services, as they apply their own conversion methods. If you want to avoid discrepancies, use the same currency in both your store and campaign, so no conversion is needed, as described in approach (a).

Step 3: Set up your offer and test it

The last step is to set up JavaScript sales tracking in HypeAuditor’s Campaign Management and place a test order to confirm everything is working smoothly.

  1. Go to your campaign in the Campaign Management tool, click Settings, and select Sales Tracking.

  2. Under the Sales Tracking tab, enable Set up tracking links. You’ll be prompted to specify the link you want influencers to promote. As a result, individual links will be automatically generated for each creator in your campaign.

Example of a generated link:

If your traffic is being directed to:

https://brand.com/shop

Then the URL should look like this:

https://brand.com/shop?ha_transaction={transaction_id}

3. Next, enable Track influencer-driven store sales, click Select tracking method, and in the popup that appears, enable Track using JavaScript code.

Once you’ve set up your offer, we highly recommend placing a test order using one of the generated influencer links and completing a test purchase. This will ensure that both clicks and conversions are being tracked correctly.

And that’s it! 🚀

With these steps, you’ve successfully set up HypeAuditor’s JavaScript Sales tracking on your non-Shopify website. Your sessions and conversions are now tracked smoothly and accurately – all without relying on third-party cookies.

Need extra help? Check out our support resources or reach out to our team!

Did this answer your question?