This article describes the architecture and steps to install the SocialLadder attribution mechanism for link based selling on non-Shopify eCommerce systems. If you are using Shopify - you can find the right article for link based tracking on Shopify here. This article is technical in nature and you may want your IT team to handle the steps below.
The SocialLadder Tracking Pixel enables our platform to receive information necessary to provide credit to ambassadors for the sales they’ve driven.
When an ambassador sends their friend a link through SocialLadder, that link is a shortened link that redirects directly to your eCommerce page. The link includes several URL parameters. Your eCommerce page will need code from SocialLadder to read the URL parameters and write a cookie. The expiration date on the cookie is configurable. Once the user eventually checks out using that web browser, another piece of code from SocialLadder will read the cookie and combine that with basic order data (amount of the order etc.) and then send that information to SocialLadder’s server. SocialLadder’s server attributes the sale to the ambassador and immediately rewards / notifies them of the completion.
The below diagram outlines the technical sequence of events that enable SocialLadder to track the conversions.
NOTE: Your IT Security team should review the diagram above to understand the details of how the tracking mechanism works.
For simple deployments, your team can simply include the reference to the SocialLadder javascript in the home page or any landing page that needs to be trackable. Your IT team may want to deploy the SocialLadder tracking javascript on your servers - this is fine, simply revise the URL below to the URL of the javascript as it resides on your servers.
Code Snippet 1
The following code needs to be installed on the home page or any landing page that an ambassador link can be directed to:
<script src="https://socialladder.rkiapps.com/ecom/socialladder-ecom.js" type="text/javascript">
</script>
Code Snippet 2
The following code needs to be deployed on the sales confirmation page that is displayed after the sale completes.
<img id="slPixel" onload="loadSLImage()" src="" height="1" width="1" />
<script src="https://socialladder.rkiapps.com/ecom/socialladder-ecom.js" type="text/javascript">
</script>
<script>
SLCheckout('{{order_number}}', '{{total_price}}', '{{slquantity}}', '{{slpromocode}}', '{{slemail}}', '{{currency}}', '{{udf}}');
</script>
IMPORTANT NOTE: The {{}} codes should be replaced programmatically with the actual data about this purchase as described below.
order_number: This is required and is any unique number for the order (used to prevent duplicate attribution).
total_price: This is required and represents the total value of the order.
slquantity: this is required and is an integer value representing the number of units (if this information is not available please set it to 1).
slpromocode: This is optional - if discount codes or promo codes are used it can be set here.
slemail: This is optional and can be the email address of the purchaser for the most secure deployments this should be eliminated.
currency: This is optional and can be used if the currency being sent into the pixel is different from the default currency for you area in SocialLadder. Please work with your Implementation Specialist or Account Manager to ensure you are using the correct format for this.
udf: This is an optional User Defined Field field that can be used to send in additional data about this conversion. This data will show on reporting of conversions.
Optional: Applying a discount with your ambassadors link
Some brands choose to offer a discount to customer who purchase using one of their ambassadors links. If you want to offer a discount, this requires a slight variation to the code installed on your home page / landing pages. Instead of the Code Snippet 1 listed above, you will deploy the code snippet below:
<script src="https://socialladder.rkiapps.com/ecom/socialladder-ecom.js" type="text/javascript">
</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>
IMPORTANT NOTE: In order for the discount to apply, you will need to modify the code snippet to automatically apply the discount into the purchasers cart. The modifications needed will vary by your specific e-commerce platform, and SocialLadder will not be able to answer questions specific to that platform. See details about the two options below:
Option 1: Apply a discount provided by SocialLadder platform
In this option, ambassadors will be assigned a discount code inside of the SocialLadder platform. When the user's link is clicked, the discount code associated with the ambassadors link will be brought down into the javascript snippet in the variable slDiscountCode.
In order for this code to provide your customer with a discount, you must insert code under the Option 1 comment in the snippet above to apply this code into your customers cart. You will need to reference the documentation for your specific e-commerce platform to determine the best way to programmatically apply this discount at checkout.
Option 2: Apply a standardized discount for all ambassador links
In this option, ambassadors will NOT be assigned a discount code inside of the SocialLadder platform. When the user's link is clicked, a generic discount will be applied to the purchasers order. This discount is not ambassador specific.
In order for this code to provide your customer with a discount, you must insert code under the Option 2 comment in the snippet above to apply the generic discount into your customers cart. You will need to reference the documentation for your specific e-commerce platform to determine the best way to programmatically apply this discount at checkout.