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

To connect your Shopify store (if you have not connected it already), navigate to Integrations > E-Commerce, then click Add for Shopify.

Step #2

Click Add.

Step #3

You will be redirected to the Shopify App Store for the Everflow app.
Click the Add app button, then enter the custom domain of your Shopify store (the part before .myshopify.com).

Then, you will need to login with your email address if you haven't already.

Step #4

Click the Install button.

Step #5

Input your Everflow network identifier. Then, click the Complete Installation button.

To find your Everflow network identifier, you can also navigate to Control Center - Platform Configurations - General Tab - General > Network Identifier.

Step #6

After clicking Complete Installation button, you will need to pay a one-time charge.

Effective June 13th at 1 PM EST, Shopify App will now impose a one-time $100 install fee that occurs for each *NEW install. Please note that this fee applies per Shopify store, not per Everflow account. Shopify will directly charge the store owner through the Shopify App Store at the time of installation. This is not an Everflow fee.

*All existing installs will not be subjected to the fee.

Step #7

Once you are successfully connected, click the Access Integration button.

Step #8

You will be redirected back to the Shopify Integrations tab in the Everflow Portal. Click Edit on the integration to set up proper Click and Conversion tracking.

Step #9

Enable the settings shown below for normal Shopify setups, including Enable Reconciliation, Install Click Script, and your Target: Advertiser. This automatically activates this Shopify Click tracking across every Offer associated with the selected Advertiser. The Enable Reconciliation toggle allows the use of the Shopify API, which adds an extra level of tracking accuracy.
For this integration, please DISABLE the Install Conversion Script from this app.

❗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;
            item.ds = line_item.discount_allocations && line_item.discount_allocations.length > 0 ? line_item.discount_allocations[0].amount : 0;
            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);
});

To find an Advertiser ID, navigate to Advertisers - Manage and select an Advertiser associated with your Shopify account.

2. To find your Tracking Domain, navigate to Control Center - Platform Configurations - Domains tab.

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 Site Tracking

Cross-Domain Tracking with Shopify with Permalinks

Integrations: Shopify

Ecwid Conversion Tracking

Headless E-Commerce Integrations for Shopify