Master Tag Installation
In order to get started on ShareASale with Wix, turn on Dev Mode in Website Editor as shown below.
...
A panel will open at on the bottom left side of the screen . On the left side of this panel, you’ll see two tabs. Click the one labeled Site and then paste the below code into thisthat lists the pages of your site. Underneath this list will be a page labeled ‘masterPage.js’. Select that option.
...
At the bottom of the screen, a panel will open with a tab labeled ‘masterPage.js’. Select that tab. Underneath that tab, in the code editor, replace the existing code with the code below.
| Code Block |
|---|
import {session} from 'wix-storage';
import wixLocation from 'wix-location';
$w.onReady(function () {
var sasId = wixLocation.query;
if (sasId.sscid) {
session.clear();
session.setItem('sasId', sasId.sscid);
}
}); |
...
Next, go to your store’s Thank You page, or whichever page is reached after an order has been successfully processed. Add an new image to the page. The image can be of anything, and you can place it anywhere on the page. Do not use an image that is already on the page. Right-click the picture that you just placed and go to View Properties. Show Properties & Events. It will be the last option in the list.
...
Once selected, the properties menu will appear in the bottom right corner of the screen. Set the ID to sasImage. Then, check the box next to Hidden on Load and then set the ID to sasImage.
...
Open under Default Values
...
Click on the Thank You Page option in the left panel of the page. In the code panel at the bottom of the screen if it’s not open already. This time, you will paste the code below into the Page tab, make sure that the Thank You Page tab is opened. You will enter the following code in the panel at the bottom.
Make sure that you replace the XXXXX in the code with your ShareASale Merchant ID. You can find this at the top-left of your ShareASale account when you are logged in.
| Code Block |
|---|
import {session} from 'wix-storage';
const merchantID = 'XXXXXX';
const sasToday = new Date();
$w.onReady(function () {
$w('#thankYouPage1').getOrder()
.then(async result => {
const orderDate = new Date(result._dateCreated);
var sas_skulist = new Array(),
sas_pricelist = new Array(),
sas_quantitylist = new Array(),
sas_clickID = session.getItem('sasId'),
sas_coupon = (result.discount && result.discount.appliedCoupon) ? result.discount.appliedCoupon.code : "",
sas_amount = result.totals.subtotal - result.totals.discount;
for (var i = 0; i < result.lineItems.length; i++) {
sas_skulist.push(result.lineItems[i].sku);
sas_pricelist.push(result.lineItems[i].priceData.price - result.lineItems[i].discount);
sas_quantitylist.push(result.lineItems[i].quantity);
}
const sasPixel = 'https://www.shareasale.com/sale.cfm?v=wix1.1&tracking=' + result.number + '&amount=' + sas_amount + '&merchantID=' + merchantID + '¤cy=' + result.currency + '&transtype=sale&skulist=' + sas_skulist + "&pricelist=" + sas_pricelist + "&quantitylist=" + sas_quantitylist + "&couponcode=" + sas_coupon + "&sscid=" + sas_clickID + "&sscidmode=6";;
if (Math.abs(sasToday - orderDate) < 86400000) {
$w('#sasImage').src = sasPixel;
} else {
console.log("Order older than 1 day. ShareASale Pixel Suppressed: " + sasPixel)
}
});
}); |
It should resemble the following:
...
IMPORTANT! Sometimes your Thank You page code might throw up an error if you have custom or multiple Thank You pages. You will see a RED circle next to the line number (usually line 7), and when you hover over this it will say “'#thankYouPage1' is not a valid selector”.
...
If you were emailed a link to this document, a test link may have been provided to you. If it wasn’t, you can obtain one from your account by clicking here.
NOTE: If you do not click the test link your order will not track.
The test link should direct you to your own store. Once there, please purchase any item in your store. Sometimes Merchants will have a test item worth $1.00 sale price, but above $0.00 minimum.
...