Overview

This guide will walk you through the Shopify integration, which also accommodates the Shopify Checkout Extensibility upgrade.

📖 Note: For more information about Shopify Checkout Extensibility, refer to [this article].

For post-purchase tracking, refer to [this article].

Step-By-Step

Step 1: Set up the Integration

Add the Shopify Integration: In your account, add the Shopify integration.
Enable Reconciliation: Enable reconciliation for the integration.
Install the Click Script: Install the click script.

❗Note that for reconciliation to work properly, you'll need to show the click script and update it to the following:

EF.click({
    offer_id: EF.urlParameter('oid'),
    affiliate_id: EF.urlParameter('affid'),
    transaction_id: EF.urlParameter('_ef_transaction_id'),
    sub1: EF.urlParameter('sub1'),
    sub2: EF.urlParameter('sub2'),
    sub3: EF.urlParameter('sub3'),
    sub4: EF.urlParameter('sub4'),
    sub5: EF.urlParameter('sub5'),
    uid: EF.urlParameter('uid'),
    source_id: EF.urlParameter('source_id'),
    creative_id: EF.urlParameter('creative_id'),
}).then(function (transaction_id) {
    const payload = {};

    if (transaction_id) {
        payload['attributes[eftid]'] = transaction_id;
    }
    if (EF.urlParameter('oid') && EF.urlParameter('affid')) {
        payload['attributes[oid]'] = EF.urlParameter('oid');
        payload['attributes[affid]'] = EF.urlParameter('affid');
    }

    $.ajax({
        type: 'POST',
        url: '/cart.js',
        data: payload,
        success: function (d) { console.log('Updated cart', d)},
        dataType: 'json'
    });
})

Step 2: Add a Custom Pixel

Navigate to Settings > Customer Events > Add Custom Pixel.

Name the pixel and click Add Pixel.

Paste the following script, replacing INSERT_ADVERTISER_ID with the advertiser ID associated with the advertiser for this Shopify integration, and INSERT_TRACKING_DOMAIN with the tracking domain from your Everflow account:

analytics.subscribe("checkout_completed", event => {
    console.log('Everflow checkout tracking started');
    var script = document.createElement('script');
    script.onload = function() {
        var aid = INSERT_ADVERTISER_ID;
        var total = event.data.checkout.totalPrice.amount;
        var tax = event.data.checkout.totalTax.amount;
        var ship = 0;
        if (event.data.checkout.shippingLine.price.amount) {
            ship = event.data.checkout.shippingLine.price.amount;
        }
        var amount = total - tax - ship;
        var email =  event.data.checkout.email;
        var order_id = event.data.checkout.order.id;
        var coupon_code = '';
        if (event.data.checkout.discountApplications.length > 0) {
            coupon_code = event.data.checkout.discountApplications[0].title;
        }
        var cookie = EF.getAdvertiserTransactionId(aid);
        var eftid;
        for (var i = 0; i < event.data.checkout.attributes.length; i++) {
            if (event.data.checkout.attributes[i].key === 'eftid') {
                eftid = event.data.checkout.attributes[i].value;
                console.log(eftid);
                break;
            }
        }
        if (!eftid) {
          console.log('No eftid found in attributes');
          eftid = cookie;
          console.log(eftid);
        }

        var order = {
            oid: event.data.checkout.order.id,
            amt: event.data.checkout.subtotalPrice.amount,
            bs: event.data.checkout.shippingAddress ? event.data.checkout.shippingAddress.province : '',
            bc: event.data.checkout.shippingAddress ? event.data.checkout.shippingAddress.country : '',
            cc: coupon_code,
            items: []
        };

        event.data.checkout.lineItems.forEach(function(line_item) {
            var item = {};
            item.ps = line_item.variant.sku;
            item.p = line_item.variant.price.amount;
            item.qty = line_item.quantity;
            console.log(item)
            order.items.push(item);
        });

        console.log(event.data.checkout);
     
        var data = {
            aid: aid,
            transaction_id: eftid,
            amount: amount,
            order: order,
            coupon_code: coupon_code,
            email: email,
            order_id: order_id,
        };

        console.log(data);

        EF.conversion(data).then((result) => {
            console.log(result);
        });
    }
 
    script.src = 'https://www.INSERT_TRACKING_DOMAIN.com/scripts/sdk/everflow.js';
    script.async = true;
    document.head.appendChild(script);
});

Click Save to apply the changes, then click Connect.

Testing the Integration

❗Ensure that Direct Linking is turned on inside the offer's Tracking & Controls section before generating a tracking link.

If using Redirect Links for this Offer, please make sure to add the following string to the end of the Base Destination URL:

?_ef_transaction_id={transaction_id}

Here is an example:

Use a tracking link for one of your Shopify offers and make a test purchase. You should see the order show up as a Conversion inside your Everflow account.

📖 Learn more about testing your tracking and troubleshooting using our Getting Started - Testing Conversion Tracking article.

Reporting

To view specific details from Shopify for a conversion:

Enter an order ID in the search bar at the top-right corner of the portal, or navigate to Reporting > Conversion to find the conversion.
Add the following columns to the report:
- Order ID
- Order Number
- Order Items

You can also filter conversions by Order ID on the Conversion Report by selecting it as a filter.

Cross-Domain Tracking with Shopify with Permalinks

Wix Integration

Unbounce Integration

Integrations: Shopify

Headless E-Commerce Integrations for Shopify