At a Glance: With Shopify and Trackier integration, you can connect your Shopify store to your Trackier platform and view all of your clicks and conversion data in one place on your Trackier dashboard.
Overview
Trackier's built-in Shopify integration offers the ability to monitor campaigns, their unique identifier, order number, and order title. This will result in improved efficiency and eliminate the need for supplementary tracking links, affiliates, or collaborators. All daily Shopify operations can be seamlessly tracked using Trackier.
Integration advantages
The clicks and the number of conversions that are reflected on the Shopify store would be tracked on the Trackier platform.
The setup process is very easy and does not require any additional technical knowledge.
The integration process has to be configured just once and would work for all the campaigns that you want to run through Shopify.
There are three methods of integrating with Shopify.
One-Click Checkout
Manual Pixel Integration
Web SDK integration
Important: We suggest using the One-Click Checkout method to track all the orders seamlessly.
Integration Infographic
This infographic will give you an overview of all the integration steps needed for a successful Shopify integration. All the steps are explained in this article.
One-Click Checkout
One-click checkout happens when customers visit their online shopping cart and purchase items within a single click.
Setting up one-click checkout is simple as a Shopify merchant. Here’s how it works:
From your Shopify admin, go to settings, then payments.
In the Shopify payments section, click Manage.
In the Shop Pay section, check Shop Pay.
Click Save.
After setting up your one-click checkout, all you need to do is create a new customer event and place our web pixel on Shopify for seamless conversion tracking.
For creating the new customer event:
Click on settings and go to customer events.
Click on Add Custom Pixel.
Add the Shopify Web Pixel, which you can get from the Trackier panel.
Shopify Web Pixel
Navigate to Automation and click on E-Commerce, then click on Setup Instructions.
Select your tracking domain and your advertiser.
Below, you can find the Shopify Web Pixel with all the macros already replaced in the pixel code.
Note: Incase of Brands, you do not need to select an advertiser. Just collect the pixel from the panel and paste it in the Shopify custom pixel
Manual Pixel Integration
Navigate to Automation and click on E-Commerce, then click on Setup Instructions.
By adding Trackier’s JS pixel or the Image tag to the Shopify store, you can start tracking the conversions on the Trackier Platform.
Step 1: Offer setup and conversion tracking pixel
Shopify allows placing the conversion tracking pixel to track conversions. After creating the campaign, you can find the JS pixel in that particular campaign or in the Shopify Integration tab in Automation.
To generate the JS pixel in the campaign, go to the conversion tracking card and select the checkbox of JS tag.
Examples
Trackier's JS pixel example
<img src="https://demo.gotrackier.com/pixel?adid=5eb27a3cb6920d71dc1c1842&sale_amount=AMOUNT¤cy=USD"> <script type="text/javascript"> (function() { var a=document.createElement("iframe"); a.setAttribute("src","https://demo.gotrackier.com/pixel?av=57c4738434243dc57d8b456d&sale_amount=AMOUNT"); a.style.width="1";a.style.height="1"; document.body.appendChild(a) })(); </script>
Trackier's Iframe pixel example
<iframe src="https://demo.gotrackier.com/pixel?av=6156db9f6cf95e1d763d9dc7&txn_id=##{{ order_number }}&sale_amount=##{{ total_price | money_without_currency }}¤cy=##{{ currency }}" scrolling="no" frameborder="0" width="1" height="1"></iframe>
Step 2-Placing pixel code in Shopify
Once you've generated the JS tag in the Trackier campaign, go to your Shopify store and select Settings. Click the checkout tab, then go to the order processing section, click the additional script, and enter the JS pixel or image tag that you obtained from the Trackier platform.
After placing the pixel, click "save" to continue.
Shopify Integration through WEB SDK
Web SDK is a simplified and more refined version of cookie-less tracking. You can easily generate the web SDK script from the panel itself and place it on the Shopify store to track all the orders that occur on any browser.
Step 1: Update the campaign URL
To implement the web SDK, it is mandatory to include the below-mentioned parameters in the campaign URL.
utm_campaign=trackier_{camp_id}&click_id={click_id}
Step 2: Place the Static Script
The static script has to be placed on all landing pages. To do that, update Shopify's “theme.liquid” file.
In the “theme.liquid” file, place the static code just after the <body> tag.
To do that, go to: Online store > Themes > Action > Edit Code > theme. liquid
Reference: https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/edit-theme-code
Static code ( Imp )
<script src=“https://static-cdn.trackier.com/js/trackier-websdk-init.js”></script>
Step 3: Fetch the thank-you page pixel from panel
We have two options for the thank you page pixel
Web SDK
web SDK for GA
Trackier Web SDK
This pixel can be generated from your panel by opening the campaign from the manage campaign section, going to the conversion tracking section, and selecting campaign or advertiser trackier Websdk depending on your needs.
Note:-
Advertiser Trackier WebSDK: We recommend using this only in cases where the advertiser is not comfortable adding pixels multiple times for different campaigns.
Campaign Trackier WebSDK: The Campaign Trackier WebSDK is only valid for a specific campaign. We recommend using the campaign-level webSDK for easier access to the Pixel log in case of an issue, instead of having to navigate to the advertiser's Pixel logs.
Your system will automatically add your account's domain and adv_unique id in your web SDK code.
Enable UTM Campaign check
If you are selecting trackier web sdk option in the tracking link section, then you have to enable UTM campaign check toggle from the basic campaign settings to ensure seamless tracking on both the ends.
Web SDK for GA ( Highly recommended )
This pixel can be generated from your panel by opening the campaign from the manage campaign section. Navigate to the Conversion tracking section, check the Web SDK for GA check box, and then fetch the specified pixel.
Your system will automatically add your account's domain and adv_unique id in your web SDK code.
Note: If init() script ( static code ) is not placed, then you can face multiple challenges in tracking.
Step 4: Add the thank you pixel to your thank-you page
To fire this pixel on the thank you page, go to the Shopify store > settings > checkout > under the order status page you will find the option to add the additional script.
Please refer to this doc by Shopify to gather more information.
Integration testing
After the setup is complete, it is recommended to test the integration by creating a test link in the Trackier panel and performing a test conversion. If the conversion is successful, the integration will produce a conversion containing the order id, order number, and order item information.
Shopify plus Integration
To ensure a smooth integration, please make sure that the custom event script is only placed in the Shopify panel. The checkout script is not required to be placed in the Shopify panel. This is an important detail to ensure that tracking and functionality are properly configured.
All other steps in the integration process will remain unchanged and should be followed according to the standard Shopify guidelines.
We're thrilled to have put together a top-notch team of qualified experts who are available to handle any of your concerns and respond to any inquiries you may have. You can contact us at any time by sending an email to support@trackier.com or using the in-platform chat feature.
