Templates: affiliate networks

Shopify

Shopify is the leading cloud-based, multi-channel commerce platform. Merchants can use the software to design, set up, and manage their stores across multiple sales channels, including web, mobile, social media, marketplaces, brick-and-mortar locations, and pop-up shops. The platform also provides merchants with a powerful back-office and a single view of their business. The Shopify platform was engineered for reliability and scale, making enterprise-level technology available to businesses of all sizes.

If you’re looking for a tracking tool that will help you gain insight into your e-commerce business, RedTrack might just be a perfect solution for you. In this article, we will show you how easy it is to integrate your Shopify store with RedTrack.

1. Assuming you already have a store, the first step you will need to do is creating a campaign in your RedTrack account. Since it’s an online shop, we understand how important it may be to track all types of incoming traffic – even organic. That is why we have a solution that works for all types of traffic you may have. If you want to track organic traffic as well, create + one more campaign for it. Here is more information on how to create a campaign in RedTrack.

2. Once a campaign is created, you will have all the necessary IDs generated automatically.

Copy it.

3. Go to your Shopify account -> Themes -> Actions -> Edit code

Go to theme.liquid -> put the following script in the header

The script is to be adjusted before:

– Update the organic campaign ID if you want to track organic traffic as well. In case you don’t want to track it, simply add // before the first 3 lines of the script.
– Update the tracking domain everywhere in the script.

<script>
var campaignIds = {
‘default’: ‘add the organic campaign id‘,
}
// Set false for register views on every site refresh
var registerViewOncePerSession = false
// Set false for last click attribution
var firstClickAttribution = false
var ourCookie = getCookie(‘rtkclickid-store’)
var rtkClickID;
function removeParam(key, sourceURL) {
var rtn = sourceURL.split(“?”)[0],
param, params_arr = [],
queryString = (sourceURL.indexOf(“?”) !== -1) ? sourceURL.split(“?”)[1] : “”;
if (queryString !== “”) {
params_arr = queryString.split(“&”);
for (var i = params_arr.length – 1; i >= 0; i -= 1) {
param = params_arr[i].split(“=”)[0];
if (param === key) {
params_arr.splice(i, 1);
}
}
rtn = rtn + “?” + params_arr.join(“&”);
}
return rtn;
};
var urlParams = new URLSearchParams(window.location.search);
var pixelParams = “&” + window.location.search
var campaignID = urlParams.get(‘cmpid’)
var souceKey = urlParams.get(‘tsource’);
if (!campaignID) {
campaignID = campaignIds[‘default’]
}
var initialSrc = “https://your.tracking.domain/”+campaignID+”?format=json”;
for (var i = 1; i <= 10; i++) {
initialSrc = removeParam(“sub” + i, initialSrc)
};
var rawData;
initialSrc = removeParam(“cost”, initialSrc);
initialSrc = removeParam(“ref_id”, initialSrc);
if (!urlParams.get(‘rtkcid’)) {
xhr = new XMLHttpRequest;
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
rawData = JSON.parse(xhr.responseText);
rtkClickID = rawData.clickid;
setSessionClickID();
if (ourCookie === null || ourCookie === undefined || ourCookie === ‘undefined’ || !firstClickAttribution) {
setCookie();
}
xhrr = new XMLHttpRequest;
if(sessionStorage.getItem(‘viewOnce’) !== 1) {
xhrr.open(“GET”, “https://your.tracking.domain/view?clickid=”+rawData.clickid)
xhrr.send();
}
if (registerViewOncePerSession) {
sessionStorage.setItem(‘viewOnce’, ‘1’)
}
}
}
if (!sessionStorage.getItem(‘rtkclickid’)) {
xhr.open(“GET”, initialSrc+pixelParams);
xhr.send();
}
else {
rtkClickID = sessionStorage.getItem(‘rtkclickid’)
if (ourCookie === null || ourCookie === undefined || ourCookie === ‘undefined’ || !firstClickAttribution) {
setCookie();
}
xhrr = new XMLHttpRequest;
if(sessionStorage.getItem(‘viewOnce’) !== 1) {
xhrr.open(“GET”, “https://your.tracking.domain/view?clickid=”+rtkClickID)
xhrr.send();
}
if (registerViewOncePerSession) {
sessionStorage.setItem(‘viewOnce’, ‘1’)
}
}
}
else {
rtkClickID = urlParams.get(‘rtkcid’)
if (ourCookie === null || ourCookie === undefined || ourCookie === ‘undefined’) {
setCookie();
}
xhrTrack = new XMLHttpRequest;
if(sessionStorage.getItem(‘viewOnce’) !== 1) {
xhrTrack.open(“GET”, “https://your.tracking.domain/view?clickid=”+rtkClickID )
xhrTrack.send();
}
if (registerViewOncePerSession) {
sessionStorage.setItem(‘viewOnce’, ‘1’)
}
setSessionClickID()
}
function setCookie(){
var cookieName = “rtkclickid-store”, cookieValue = rtkClickID ,expirationTime = 2592000 * 1000,
date = new Date(), dateTimeNow = date.getTime();
date.setTime(dateTimeNow + expirationTime); var date = date.toUTCString();
document.cookie = cookieName+”=”+cookieValue+”; expires=”+date+”; path=/; domain=.” +
location.hostname.replace(/^www\./i, “”); // Sets cookie for all subdomains
}
function setSessionClickID() {
sessionStorage.setItem(‘rtkclickid’, rtkClickID);
}
function getCookie(name) {
var value = “; ” + document.cookie;
var parts = value.split(“; ” + name + “=”);
if (parts.length == 2) return parts.pop().split(“;”).shift();
}
</script>

Don’t forget to save the changes.

4. Now you need to set the postback for your store.
Go to setting -> Checkout

Adjust the postback script and place it inside the additional scripts section:

– Replace the domain to the one you are using

<script>
function getCookie(name) {
var value = “; ” + document.cookie;
var parts = value.split(“; ” + name + “=”);
if (parts.length == 2) return parts.pop().split(“;”).shift();
}
var rtCookie = getCookie(‘rtkclickid-store’)
document.addEventListener(“DOMContentLoaded”, function() {
var capturedText = document.querySelector(“.total-line.total-line–subtotal>.total-line__price>.order-summary__emphasis.skeleton-while-loading”).innerText
capturedText = capturedText.substr(1);
capturedText = capturedText.replace(/,/g, ‘.’)
var request = new XMLHttpRequest();
request.open(“GET”, `https://your.tracking.domain/postback?clickid=${rtCookie}&sum=${capturedText}`)
request.success = function(response) {
console.log(response);
};
request.fail = function(error) {
console.log(error);
};
//and finally send it away
request.send();
})
</script>

*If you plan to use it for several thank you pages, keep in mind that you will need to update the CSS selector accordingly.

5. Generate your tracking links and start tracking.
For the script to work properly, you need to add some additional parameters to your links.

Add rtkcid={clickid}&cmpid={campaignid} to your offer URL in RedTrack (your Shopify store URL). You can use the campaign URL to track your traffic.

Related Articles