How To Implement TikTok Pixel & Server-Side Tracking with Skio Subscriptions
Elevar powers your data layer and server-side tracking needed to connect TikTok and Skio.
Integration Specs
- Channel Accuracy Monitoring
- Requires Elevar Data Layer
- GTM server-side client customizable
- Chrome Extension
- Elevar Server-Side
- GTM Server-Side
- GTM Web Container
What's Included
Events
What customer events are tracked in this integration
- Pageview
- Product View
- Add To Cart
- Initiate Checkout
- Place An Order
- Search
- Purchase
- Base Tag
- Identify Tag
- Click ID
- Event ID
Customer Parameters
What customer parameters are tracked in this integration
- phone number
- customer id
- click id
- order id
Steps to Implement
Step 1: Overview
PLEASE NOTE: Since Skio uses the native Shopify checkout, these steps are the exact same as our Shopify <> TikTok Integration guide.
Before you can enable your TikTok Events API Destination, you will need to:
- Install Elevar’s Data Layer on your store or ensure you are on Elevar Data Layer Version 2.28+. This can be done inside your Elevar Dashboard > Data Layer.. If you are not on version 2.28 or above, then you’ll need to go through the upgrade steps.
- Install Elevar’s Shopify Notifications to add Webhook listeners to your store for purchases
Plus, TikTok recommends adding their client-side tracking in parallel with server-side tracking. So if you would like to implement this then follow this step included below as well.
Step 2: Add UTM & ttclid Query Parameters to your TikTok Links
1. Start by adding UTM parameters to your TikTok Ad URLs. [How do I do this?]
So if your old links were something like this:
They will now be similar to this:
https://yourdomain.com?utm_source=tiktok&utm_medium=paidsocial
2. Add “ttclid” as a query parameter at the end of your URLs
&ttclid=__CLICKID__
Your links that you just configured to mirror the below:
https://yourdomain.com?utm_source=tiktok&utm_medium=paidsocial
Will now have the ttclid added similar to this:
https://yourdomain.com?utm_source=tiktok&utm_medium=paidsocial&ttclid=__CLICKID__
Note: the CLICKID is TikToks “macro” and should be left exactly as it’s shown above.
More info here – https://ads.tiktok.com/marketing_api/docs?rid=959icq5stjr&id=1701890980108353
Step 3: Import your Pre-Built TikTok Tags to Google Tag Manager
TikTok is similar to Facebook where TikTok wants you to send both your Pixel events [Browser/Client-Side Tagging] and your Event API data [Server-Side Tagging] to TikTok, and TikTok will deduplicate identical events.
To set up your TikTok Pixel with the needed deduplication setup:
- Click here to be taken to the Pre-Built TikTok Tags (for Events API).
- Add in your TikTok Pixel ID > Select Download Container
- Log into Google Tag Manager > Select your desired Web GTM Container
- Navigate to Admin > Import Container > Upload the file you just downloaded from Elevar
- Select New under Choose Workspace > titled it Elevar TikTok Pixel + Events API
- Select Merge > Then select Overwrite > Then Confirm
- [Optional] QA the newly uploaded tags using Google Tag Manager’s Preview Mode
- Once you’re ready to publish, navigate to the Elevar TikTok Pixel + Events API Workspace > Select Submit at the top right > Then Publish
Step 4: Navigate to the TikTok Events API Install Wizard in your Elevar App
In your Elevar App, navigate to Server-Side > Select Add Destination > Find and select TikTok.
You’ll be taken to an Overview Page, select Get Started
Step 5: Select your Events
In this first step you are simply choosing what events you want enabled for your Events API.
By default, we’ve already selected the standard recommended events for you! Most likely, you won’t need to adjust anything and can just select Save to continue to the next step.
If you are a subscription business then you have the option to also enable the “Subscribe” event. Selecting this option will trigger a “Subscribe” event to fire anytime your customers purchase a subscription (e.g. Subscription First Order). If you also sell one-time products via native Shopify checkout then this event can help you distinguish between first-time and subscription purchases inside of TikTok.
Note: recurring orders are handled separately in the Subscription settings below.
Step 6: Select your Product Identifier
Product ID is the most common primary “content_id” in TikTok catalog integrations. You’ll want to match the product identifier used in your Pixel/Events API tracking to the product identifier you use in your Product Catalog in TikTok.
If you are migrating from the native Shopify <> TikTok Channel, then you will likely leave this as Product ID. The Shopify <> TikTok Channel uses the Product ID by default, so this will map over as you currently have it.
Our pre-built tags also use Product ID by default. So if you select Product ID in this step, nothing further needs to be done. You can save & continue to the next step.
If you choose a different Product Identifier for your TikTok Events API, be sure to change your TikTok tags in Google Tag manager to match! This will need to be updated for your Product View, Add to Cart, Initiate Checkout, and Purchase TikTok Tags in Google Tag Manager.
Step 7: Block Transactions
This step allows you to control exactly what purchase events are sent to TikTok’s Event API. You can block orders based on Source Channel Names, Order Tags or Order Gateways.
Two common scenarios where you may want to block orders are: recurring orders & offline orders. Learn how to block these orders in this guide.
Not sure if you need to block orders? Look at what Sales Channels you have in Shopify!
Step 8: Add in Your TikTok Pixel & Access Token
Add your Pixel ID, TikTok Access Token, and click Save & Continue.
You can then choose to go live.
Step 9: Monitor Accuracy in Real Time
Once you are live then you can view transactions in real-time including all attribution data for the order:
And you can also view your conversion accuracy over time:
Step 1: Overview
PLEASE NOTE: Since Skio uses the native Shopify checkout, these steps are the exact same as our Shopify <> TikTok Integration guide.
Step 2: Install Data Layer to Your Store
In order to deploy TikTok conversion tracking via Google Tag Manager tags, you need to have a data layer implemented on your Shopify store that pushes customer, product, and order data that TikTok’s tags require.
If you don’t have a data layer for your Shopify store yet, then you can utilize Elevar’s data layer for Shopify. It’s a 1-click installation into your theme.
Step 3: Download Container for GTM
Inside of your Elevar account, go to Pre Built Tags > TikTok.
Update your TikTok pixel ID in the tag settings shown below.
Download the container and save to your computer.
Step 4: Import Container to GTM
Next up, go to your Google Tag Manager container > Admin > Import.
Be sure to select Merge container, not overwrite.
Once you’ve imported, verify your Pixel ID variable is accurate.
Step 5: QA & Publish
Once you’re ready to go live then put GTM into preview mode.
You can navigate the site and place an order to verify your TikTok tags trigger as expected.
Remember that the data layer from step 1 needs to be live on your store in order for the variables – like revenue and order id – to populate.
Compatible Data Sources
Data Layer
FAQs
View common integration questions
-
The TikTok Sales Channel no longer allows you to separate use of the Catalog vs the Pixel in the app. You can either use another software for your TikTok Feed Management or pause your TikTok tags in GTM & use the native app for your TikTok Pixel.
-
TikTok optimizes on the Complete Payment event.
