How can we help?

Conversion tracking via JavaScript

Our Checkout Javascript API enables you to track conversions on third-party platform like Facebook or Google Ads (for example: use Google's Ecommerce Measurement to collect ecommerce related data).

How to track conversions

Once you've installed VaocherApp checkout form onto your website, (see instruction at, you can add extra code to track the new orders (e.g. conversions).

When an order is placed successfully, we will fire an event called conversion that contains all the necessary data you need. You can simply register the event handler like below:

vaocherapp('conversion', function (payload) {

Transaction Data

Following are the available attributes when an order has been placed successfully (the "payload" example above):

transaction_idStringThe transaction ID
amountNumberThe total paid for the order in smallest unit(1)
currencyStringThe payment currency
test_modeBooleanWhether or not this is a test order
gift_vouchersArrayList of generated gift voucher(s)
purchaserObjectThe purchaser info, including name and email
recipientObjectThe recipient info, including name and email

A single gift_vouchers has these following attributes:

idStringThe gift voucher ID
codeStringThe gift voucher unique reference code
itemStringThe purchased menu item name
balanceNumberThe remaining balance in smallest unit(1)

Example payload:

    "transaction_id": "tran_0123456789",
    "amount": 10000,
    "amount_with_currency": "$100.00",
    "currency": "AUD",
    "test_mode": false,
    "gift_vouchers": [
            "id": "abcxzy-1234-5678-0000-123456789",
            "code": "UNIQUE-CODE",
            "item": "$100 Gift Voucher",
            "balance": 10000,
            "balance_with_currency": "$100.00"
    "order_download_url": "",
    "purchaser": {
        "name": "Purchase name",
        "email": ""
    "recipient": {
        "name": "Recipient name",
        "email": ""

Note (1): Currencies in VaocherApp are always in smallest unit. That means 100 is equivalent to $1, whereas 10000 is equivalent to $100


Below is the full example to track version:

<!-- Make sure to load VaocherApp latest embed script -->
<script type="text/javascript">(function(e,c,a,s){e[s]=e[s]||function(){(e[s].callbacks=e[s].callbacks||[]).push(arguments)};var t=c.createElement("script");t.async=1,t.defer=1,t.src=a,c.head.appendChild(t)})(window,document,"","vaocherapp")</script>

<script type="text/javascript">
vaocherapp('conversion', function(payload) {
    // Make sure you have loaded the Google Analytics embed code
    // Then load the Google Analytics Ecommerce plugin (see
    ga('require', 'ecommerce');
    ga('ecommerce:addTransaction', {
        'id': payload.transaction_id,
        'revenue': payload.amount_with_currency,
        'currency': payload.currency.toUpperCase(),
        'shipping': '0',
        'tax': '0',
        'affiliation': 'VaocherApp',

    for (var i = 0; i < payload.gift_vouchers.length; i++) {
        let giftVoucher = payload.gift_vouchers[i];

        ga('ecommerce:addItem', {
            'id': payload.transaction_id,
            'name': giftVoucher.code + ' - ' + giftVoucher.item,
            'sku': giftVoucher.code,
            'category': giftVoucher.item,
            'price': giftVoucher.balance_with_currency,
            'quantity': '1',
            'currency': payload.currency.toUpperCase(),


If you're using sku in tracking ecommerce:addItem, you need to make sure it's value is unique for each item. Otherwise, Google Analytics Ecommerce only sends last item in transaction. See here