Checkout Champ is ready for you to add your Google Analytics (Google Tag Manager), Facebook, SnapChat, TikTok, and/or Listrak pixels.
Edit the funnel’s settings and open the Tracking Pixels section:
You can simply add your GTM, FB Pixel, SnapChat, TikTok, or Listrak Pixel IDs into the provided fields.
If you add the Tracking Id in the left column, you do not need to add the custom tracking code in the right column. Conversely, if you add the custom tracking code, you do not need to add the Tracking Id.
For Google Analytics the following events are fired:
Purchase (with an option to fire after initial sale or after all upsells)
For Facebook the following events are fired:
ViewContent (presell pages)
Lead (when a lead page is submitted)
AddToCart (when an item is added to the shopping cart)
CustomizeProduct (when variant details are changed by the consumer)
InitiateCheckout (when a checkout page loads and there is a card number input on the page)
AddPaymentInfo (when a checkout page is submitted with card information)
Purchase (with an option to fire after initial sale or after all upsells)
If you wish to fire other FB pixel events, you can use the Custom Head Tracking Code section on the right side of the page.
You can optionally fire the Facebook Conversions API. Enter your access token (be sure to whitelist your domain and generate token by a system user to avoid expiration). The Conversions API fires the same events as the pixel. It can be advantageous when the pixel (client-side) is blocked by the consumer’s browser.
SnapChat
For SnapChat the following events are fired once the cardholder’s email address is known:
Page View (all pages)
Purchase (with an option to fire after initial sale or after all upsells)
TikTok
For TikTok the only requirement is that the ID is entered here. All remaining configuration is done at TikTok.
Shopify TikTok pixels do not allow you to edit the events, you will need to add the scripts manually using your Shopify TikTok pixel ID on each page.
Example:
// BASE CODE TEMPLATE:
<script>
//Part1
!function (w, d, t) {
w.TiktokAnalyticsObject=t;var ttq=w[t]=w[t]||[];ttq.methods=["page","track","identify","instances","debug","on","off","once","ready","alias","group","enableCookie","disableCookie"],ttq.setAndDefer=function(t,e){t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}};for(var i=0;i<ttq.methods.length;i++)ttq.setAndDefer(ttq,ttq.methods[i]);ttq.instance=function(t){for(var e=ttq._i[t]||[],n=0;n<ttq.methods.length;n++)ttq.setAndDefer(e,ttq.methods[n]);return e},ttq.load=function(e,n){var i="https://analytics.tiktok.com/i18n/pixel/events.js";ttq._i=ttq._i||{},ttq._i[e]=[],ttq._i[e]._u=i,ttq._t=ttq._t||{},ttq._t[e]=+new Date,ttq._o=ttq._o||{},ttq._o[e]=n||{};var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=i+"?sdkid="+e+"&lib="+t;var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)};
//Part 2
ttq.load('YOUR PIXEL ID WILL BE LOCATED HERE');
ttq.page();
}(window, document, 'ttq');
</script>
For more event codes visit https://ads.tiktok.com/marketing_api/docs?rid=5ipocbxyw8v&id=1701890973258754
CheckoutChamp does not limit the number of pixels you can use at a time. You will however need to add them manually and place the correct events on them.
On Part 2 of the code provided by TikTok you will add your pixel id’s.
// BASE CODE TEMPLATE:
<script>
//Part1
!function (w, d, t) {
w.TiktokAnalyticsObject=t;var ttq=w[t]=w[t]||[];ttq.methods=["page","track","identify","instances","debug","on","off","once","ready","alias","group","enableCookie","disableCookie"],ttq.setAndDefer=function(t,e){t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}};for(var i=0;i<ttq.methods.length;i++)ttq.setAndDefer(ttq,ttq.methods[i]);ttq.instance=function(t){for(var e=ttq._i[t]||[],n=0;n<ttq.methods.length;n++)ttq.setAndDefer(e,ttq.methods[n]);return e},ttq.load=function(e,n){var i="https://analytics.tiktok.com/i18n/pixel/events.js";ttq._i=ttq._i||{},ttq._i[e]=[],ttq._i[e]._u=i,ttq._t=ttq._t||{},ttq._t[e]=+new Date,ttq._o=ttq._o||{},ttq._o[e]=n||{};var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=i+"?sdkid="+e+"&lib="+t;var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)};
On Part 2 you will add your multiple TikTok pixels
//Part 2
ttq.load('YOUR PIXEL ID WILL BE LOCATED HERE');
ttq.load('YOUR PIXEL ID WILL BE LOCATED HERE');
ttq.load('YOUR PIXEL ID WILL BE LOCATED HERE');
ttq.page();
}(window, document, 'ttq');
</script>
For more event codes visit https://ads.tiktok.com/marketing_api/docs?rid=5ipocbxyw8v&id=1701890973258754
Triple Whale
Enable the Triple Whale checkbox to automatically add the Triple Whale script to the funnel. This requires a Shopify plugin attached to the funnel’s campaign.
More information is here
Listrak
For Listrak an email is captured as soon as it is entered on a lead or checkout page. Once that is complete an UpdateCart event is called for any product or price changes. The order is automatically submitted based on the setup option - after initial sale or after all upsells.
The following information is sent to Listrak on a purchase: email address, first name, last name, order ID, customer ID, order total amount, shipping total amount, tax total amount, and item information (sku, quantity, price).
Custom Head/Body Tracking Code
These sections can be used to place tracking scripts on all pages of your funnel.
Place the code directly on the page
Checkout Champ allows you to directly add code to a page by clicking the Edit button in the page builder.
Global Scripts
Scripts can be automatically added to specific funnels that you determine. For more information, please view our Global Scripts article.