This guide explains how to install the SocialLadder Tracking Pixel for selling on non-Shopify eCommerce systems, when your checkout page uses a different domain than the rest of your site (for example, your store is on brand.com
but checkout happens on checkout.brandstore.com
).
⚠️ Note: This requires technical setup. Involve your IT/development team.
Why This Is Needed
SocialLadder’s link attribution works by dropping a cookie on the landing page when a customer arrives through an ambassador’s referral link:
An ambassador shares their referral link.
The customer lands on your site via that link—SocialLadder’s tracking parameters are embedded in the URL.
These parameters are stored in a cookie on the customer’s browser.
At checkout, the cookie is read and sent with the order details, enabling you to attribute the sale to the correct ambassador.
This flow assumes the cookie created on the landing page is still available on the checkout page.
However, when your checkout runs on a different domain (for example, your store is on brand.com
but checkout happens on checkout.brandstore.com
), browser security policies prevent cookies from being shared between domains. That means the tracking cookie is lost by the time the customer completes their purchase—making attribution impossible unless you take corrective action.
That’s why this workaround is needed: to manually capture and persist the cookie on landing, securely store it, and then make it available again on the checkout page so attribution can continue to function correctly.
Installation Overview
The installation involves three steps:
Landing Pages – Add the SocialLadder JavaScript to your home page and any landing pages where ambassador links may direct traffic.
Persist the Cookie on Your Side (bullet point #7) – When SocialLadder Pixel drops the cookie, your site should capture and persist it.
Sales Confirmation Page (bullet point #9)– Retrieve SocialLadder's pixel information and use our checkout tracking code to report the order data.
Step 1: Landing Page Setup (Required for Link Attribution)
Add this code snippet to the <head>
section of your homepage or any landing page where an ambassador referral link could send visitors:
<script src="https://socialladder.rkiapps.com/ecom/socialladder-ecom.js" type="text/javascript"></script>
Step 2: Persist the Cookie on Your Side
Add a helper function to your JavaScript to read the cookie values such as below:
JavaScript Example:
function getSocialLadderCookie(name) {
const cookies = decodeURIComponent(document.cookie).split(';');
for (let c of cookies) {
c = c.trim();
if (c.startsWith(name)) {
return c.substring(name.length);
}
}
return null;
}
//values you need to store
var trackID = getSocialLadderCookie('sl-track-purchase=');
var shopCode = getSocialLadderCookie('sl-shop-code=');
💡 Note: Capture these values from the cookie and store them on your server. The storage method is up to you, as long as the values can be retrieved on the sales confirmation page.
Step 3: Sales Confirmation Page
On the order confirmation page, you’ll include the following snippet:
<img src="//socialladder.rkiapps.com/socialladderapi/api/v1/campaign/track?Action=SALE&UDF1={{order_number}}&udf2={{total_price}}&udf3={{shopcode}}&udf4={{slquantity}}&udf5={{slpromocode}}&udf7={{slemail}}&ITBGUID={{slcguid}}&UDF14={{currency}}&UDF9={{udf}}">
Replace the {{}}
placeholders programmatically with your order data.
Data Fields Reference
order_number (required): Unique identifier for the order (prevents duplicates).
total_price (required): Total value of the order.
shopcode (required):
shopCode
retrieved from SocialLadder's cookie.slquantity (required): Integer count of units. If not available, set to 1.
slpromocode (optional): Any discount/promo code used.
slemail (optional): Purchaser’s email address. Omit for stricter privacy.
slcguid (required):
trackID
retrieved from SocialLadder's cookie.currency (optional, link only): Use if different from your SocialLadder default.
udf (optional): User-defined field for additional conversion data.
💡 Optional: If you want referral links to automatically apply a discount when they're clicked, see the Discount Setup section below.
Discount Setup
To automatically apply discounts when people click on your ambassadors' referral links, add this snippet to the standard landing page script:
<script>
const myTimeout = setTimeout(onload, 2000);
function onload () {
if (slCookiesExists()) {
var slDiscountCode = getSLDiscountCode();
if (slDiscountCode) {
// Option 1: Insert platform specific code here.
} else {
// Option 2: Insert platform specific code here.
}
}
clearTimeout(myTimeout);
};
</script>