Advice and answers from the SupaDupa Team

Please note: if you would like to include your Google Adwords tracking code do not follow these steps listed in this article, instead please read: Adding Google AdWords Conversion Tracking

SupaDupa now supports presenting a code snippet on the Thank You page - a page the user is shown once an order has been placed. This allows you to use the order conversion code tracking provided by a range of providers including Facebook. Each time an order is placed, and thus a conversion is tracked, you’ll want to notify the third-party provider of certain values which are unique to the order, including the currency, and the order total amount for example. To account for this, the following value placeholders are provided, in the form of Liquid variables, which can be used in your code snippet, and replaced with the actual values when the code snippet is loading within your Thank You page.

These values are:

{{ order.total }}

{{ order.total_in_cents }}

{{ order.shipping_total }}

{{ order.goods_total }}

{{ order.items_count }}

{{ order.currency }}

{{ order.number }}

{{ order.product_handles }}

The code snippet can be entered into your Shop Settings within the SupaDupa Admin, and makes use of the Liquid templating system to allow you to make use of the dynamic values, particular to each order.

Example of using a tracking conversion code:

Step 1
The first step is to obtain your tracking conversion code snippet from the third party service you are using.

In this example, we use Facebook, who provides a snippet like the following:

-------------------

<!-- Facebook Conversion Code for Checkouts - Demo SupaDupa -->

<script>(function() {

var _fbq = window._fbq || (window._fbq = []);

if (!_fbq.loaded) {

var fbds = document.createElement('script');

fbds.async = true;

fbds.src = '//connect.facebook.net/en_US/fbds.js (https://3c-lxa.mail.com/mail/client/dereferrer?redirectUrl=http%3A%2F%2Fconnect.facebook.net%2Fen_US%2Ffbds.js)';

var s = document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(fbds, s);

_fbq.loaded = true;

}

})();

window._fbq = window._fbq || [];

window._fbq.push(['track', ‘ACCOUNT _NUMBER', {'value':'0.00','currency':'AUD'}]);

</script>

---------------------------

Step 2
The conversion code is used to inform Facebook of each sale. With each notification to Facebook, you want to be able to send the value and currency of each particular order. You’ll see in the code snippet above, that the ‘value’ is set to 0.00, and the curreny to ‘AUD’. We want these values to match the actual values for the current order. The SupaDupa platform provides three values which can be used as placeholders, and will be swapped in for the real values when the user is on the Thank You page, after having made a purchase. The values are noted above, and are: {{ order.total }} and {{ order.currency }}.

With the code snippet above, this will mean changing this line:

window._fbq.push(['track', ‘ACCOUNT _NUMBER', {'value':'0.00','currency':'AUD'}]);

to become:

window._fbq.push(['track', ‘ACCOUNT _NUMBER', {'value’:’{{ order.total }}','currency’:’{{ order.currency }}'}]);

Likewise, in this example you’ll want to do the same for the bottom of the snippet, so that this:

-------------------

<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=6027917602968&cd[value]=0.00&cd[currency]=AUD&noscript=1 (https://3c-lxa.mail.com/mail/client/dereferrer?redirectUrl=https%3A%2F%2Fwww.facebook.com%2Ftr%3Fev%3D6027917602968%26amp%3Bcd%5Bvalue%5D%3D0.00%26amp%3Bcd%5Bcurrency%5D%3DAUD%26amp%3Bnoscript%3D1)" /></noscript>

-------------------

Is updated to use the place holder values as follows:

-------------------

<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=ACCOUNT_NUMBER&cd[value]={{ order.total }}&cd[currency]={{ order.currency }}&noscript=1 (https://3c-lxa.mail.com/mail/client/dereferrer?redirectUrl=https%3A%2F%2Fwww.facebook.com%2Ftr%3Fev%3D6027917602968%26amp%3Bcd%5Bvalue%5D%3D0.00%26amp%3Bcd%5Bcurrency%5D%3DAUD%26amp%3Bnoscript%3D1)" /></noscript>

-------------------

Step 3

With the code snippet updated, now enter this into the ‘Order conversion code’ section of the Shop Settings - being sure to save your changes.



Once saved, the code snippet will automatically be inserted into the Thank You page when an order completes a purchase.

We strongly recommend making a test purchase on your own store to check that this is working for you. Any questions, get in touch!

Did this answer your question?