Integration of AffilBox and Wix e-shop

Datum přidání05. 04. 2020
AutorKateřina Střelcová
Integration of AffilBox and Wix e-shop

Are you running an eshop on the Wix platform? Your sales could be an order of magnitude higher thanks to affiliate marketing. You can link the commission program on AffilBox to the platform if you own the paid version of the eshop, or Wix Premium.

Deployment Progress

Insert tracking code

Open editing your store. Select Edit site from the menu:

Select Settings from the top menu. Select the sub-item Tracking & Analytics.

Click New Tool.

Select the Custom subheading from the following selection.

In the next window, you will be able to insert directly your tracking code from the campaign created in AffilBox. Paste it into the first window.

Name item – name your code so that you can find it easily next time (we chose the name Tracking code.

From the next menu, select All pages. Tracking code belongs to all pages of your store. Select Load code once (you only need to have the cookies count once on your pages.)

Place code in: This is where you choose exactly where the code will be placed in the page source. Select Body – start.

Don’t forget to save everything with the Apply button.

You can publish everything you just saved with the Publish button on the top right.

Insert conversion code:

In the left menu of your store editor, click on the top menu – Menus & Pages.

In the submenu, click on Store pages and then on Thank You Page. The conversion code belongs only to the thank you page of the store – it gives us information about the order you just completed.

Because we will be interfering with the page code, in order to pass all the important information to AffilBox, we need to enable developer mode. In the top menu, click Dev Mode. Then click Turn on Dev Mode.

Now you need to open the bottom bar and change the code in it to this.

$w.onReady(function () {
	$w('#thankYouPage1').getOrder()
		.then((order) => {
			$w('#html1').postMessage(order);
		})
		.catch((error) => {
		});
});

Now click on the plus icon “Add” in the left menu.

In the submenu, first select More at the bottom, then Custom Embeds and specifically HTML iframe.

A square will be created on your page. Edit it and paste the conversion code into it. You will need to edit it according to the instructions below.

Edit conversion code

The conversion code that AffilBox generated for your campaign needs to be modified so that Wix can process it. We’ve prepared the code for you, you just need to replace two pieces of information in it (highlighted in the image below):

  • your license domain (must be in the same form as in the tracking code)
  • campaign number

Code text:

<script type="text/javascript">
    window.onmessage=(event)=> {
        if (event.data) {
            var orderObject = event.data;
            var totalCost = 0;
            for (i = 0; i < orderObject.lineItems.length; i++) {
                totalCost += orderObject.lineItems[i].totalPrice - orderObject.lineItems[i].discount;
                if (orderObject.lineItems[i].taxIncludedInPrice === true) {
                    totalCost -= orderObject.lineItems[i].tax;
                }
            }
        }
        var ab_instance = "cxxx.affilbox.cz";
        var ab_campaign = x;
        var iframe = document.createElement('iframe');
        iframe.src = "https://"+ ab_instance +"/konverze/kid/"+ ab_campaign +"/cena/"+ totalCost +"/transaction/"+ orderObject.number +"/";
        iframe.width = 1;
        iframe.height = 1;
        iframe.style = "border: 0";
        iframe.scrolling = "no";
        document.body.appendChild(iframe);
    }
</script>

Drag the embed code square to the bottom of the page so that it does not stay in the header:

Publish everything.

Functionality Testing:

  • For your AffilBox campaign, copy your affiliate link.
  • Paste the link into a new anonymous browser window. Wait for the whole page to load.
  • In AffilBox, in the left menu – Stats – Clickthrough Report – check to see if there is a new clickthrough. If so, continue on, your tracking code is inserted fine
  • In the anonymous window, continue with the order, add the item to the cart and complete the order as a classic customer.
  • After the thank you page is displayed, check the AffilBox. In the left menu – Statistics – Conversion Report you should see the new conversion. It is important that it has the correct reward amount and order number

If you need any advice or to make sure your process is correct, please get in touch, we’d be happy to help.

Komentáře (1)

David 22. 04. 2020

Great detailed manual, installation was successful the first time and it works perfectly.

Ondřej Martinek 15. 06. 2020

Thank you! We are glad that you use WIX.

Leave a comment

Your email address will not be published. Required information is marked with *