1) Turn ON Dev Mode

Go to Edit Site and make sure Dev Mode is ON:
https://cl.ly/70fa5e1b5eba

2) Create Brandbassador collection

Create a new collection called Brandbassador and make sure you set Custom Permissions to allow read and delete to Anyone, exactly like in the video below:
https://cl.ly/9ca90b43af4f

We need this to store the used Discount Coupon, because Wix doesn’t give this info to us on the Thank You page. So we store it in a collection until we read it from there. As soon as we used that info we delete it. (this is why we need read and delete set to Anyone).

3) Create Public/bb.js file

Create a new file called bb.js under Public section and copy the code below to it:
https://cl.ly/2815b164735a

This is the script which will check if the tracking link Reference is set.

CODE

123456789import wixLocation from 'wix-location';import {local} from 'wix-storage';export function checkTrackingLink() {    var params = wixLocation.query;    if (params.ref && params.ref.substring(0, 3) === "bb-") {        local.setItem("bb-ref", params.ref);    }}

4) Add the above script to Home and Product Page pages

Both for Home and Product Page pages do the following steps:
https://cl.ly/f0cc8556d922

  • add this line of code at the beginning of the file:1import {checkTrackingLink} from 'public/bb.js'; 
  • add the below line of code right after $w.onReady(function () { line:1checkTrackingLink();

In the 3rd step we defined the method which checks the tracking link reference. In the current step we added this method under Home and Product Page pages, so the ref params will be checked on these two pages.

5) Add this code to Backend/events.js

Add the following code to Backend/events.js file. If there is no events.js file just create a new one called events.js:
https://cl.ly/6e79f7ef44d7

CODE

1234567import wixData from 'wix-data';export function wixStores_onCartCompleted(event) {    if (event.buyerInfo && event.buyerInfo.id && event.appliedCoupon && event.appliedCoupon.code) {        wixData.insert("Brandbassador", { buyerId: event.buyerInfo.id, code: event.appliedCoupon.code });    }}

As detailed in the 2nd step we Wix doesn’t provide us the Discount Coupon information on the Thank You page.

This is why we need this code here to retrieve the Discount Coupon when cart is completed and save it into the collection created in the 2nd step.

6) Add this code into Thank You Page

Copy and paste the following code into Thank You Page:
https://cl.ly/d5e50fb7c420

 Make sure

  • AUTH_KEY is set to the actual brand tracking pixel auth key
  • #thankYouPage1 is the actual name of the web shop thank you page section, as shown in the video

CODE

import wixData from 'wix-data';

import {local} from 'wix-storage';

import {fetch} from 'wix-fetch';

 

var AUTH_KEY = "key";

 

$w.onReady(function () {

$w('#thankYouPage1').getOrder().then((order) => {

setTimeout(() => {

var collection = "Brandbassador";

wixData.query(collection).eq("buyerId", order.buyerInfo.id).find().then((result) => {

var ref = local.getItem("bb-ref"), code = "";

if (result.items.length) {

var item = result.items[0];

wixData.bulkRemove(collection, result.items.map(i => i._id));

code = item.code;

}

if (ref && ref.length > 0) {

local.removeItem("bb-ref");

fetch("https://api.brandbassador.com/tracking/pixel.gif?tracking_link=true&ref="+ref+"&order_id="+order.number+"&total="+order.totals.total+"&key="+AUTH_KEY+"&currency="+order.currency);

} else if (code && code.length > 0) {

fetch("https://api.brandbassador.com/tracking/pixel.gif?order_id="+order.number+"&total="+order.totals.total+"&code="+code+"&key="+AUTH_KEY+"&currency="+order.currency);

}

});

}, 2000);

}).catch((error) => {});

});

This is the last step and this code is the actual Tracking Pixel script, which will check on the Thank You if there is a Reference set or a Discount Coupon used and will fire the call to the Brandbassador API accordingly.

It will also clean all the temporary data set previously.

Did this answer your question?