Google Tag Manager (GTM) is a tag management system that enables you to quickly and easily add measurement codes and related code fragments collectively known as tags on your website. If you use Google Tag Manager to manage tags on your website, you can install TikTok Pixel to measure and optimize the impact of your advertising.
This article explains the steps to add the TikTok Pixel (client-side) tag to your website. You can also use Google Tag Manager to set up both TikTok Pixel and Events API (server-side), and take advantage of the benefits of both server-side and client-side setups to maximize performance.
Learn about the benefits of implementing Events API and how to install both Pixel and Events API with Google Tag Manager.
To use Google Tag Manager to set up TikTok Pixel, you will need to:
Set up a Google Tag Manager account and install it on your website.
Create a Google Tag Manager web container for the website. Your 'Container permissions' must have Publish, Approve, Edit, and Read permissions.
Familiarize yourself with Google Tag Manager concepts like tags, triggers, and variables.
For detailed guidance to complete these required steps, please refer to Google's Help Center to Create an account and container and Install a web container.
There are two methods for setting up TikTok Pixel with Google Tag Manager:
Installing TikTok Pixel through TikTok Events Manager (Recommended)
Installing TikTok Pixel through your Google Tag Manager account
The interactive setup flow in TikTok Events Manager allows you to configure and install all necessary TikTok tags, triggers and variables to your Google Tag Manager Web container. These steps outline how to create a new TikTok Pixel and complete event setup through Events Manager.
To create a new data connection, go to Tools > Events > TikTok Events Manager > Connect data source > Web > Partner setup
Note: To integrate an existing TikTok Pixel with Google Tag Manager, go the Settings tab for that Pixel in Events Manager, and go to Choose Partner > Google Tag Manager > Client-side tagging to begin setup.
2. Select Google Tag Manager
3. Select Client-side tagging
4. Follow the screens and log in to your Google account that is linked to your GTM workspace.
Specify a name for your pixel if you're creating a new one. Select the Google Tag Manager account, Container and Workspace that you wish to install the TikTok tags. If you prefer to use a new Container, first create one in your Google Tag Manager account, then return to this screen and select 'Refresh'.
Next, select the method to set up events and parameters (you will build these tags at a later step). There are two setup methods available:
Set up with TikTok Event Builder (Recommended): With our Event Builder tool, you can create events and parameters directly from your website without requiring changes to website code. Learn more about Event Builder.
Use Google Tag Manager Data Layer APIs: A data layer is a JavaScript object that is used to pass information from your website to your Tag Manager container. This method installs TikTok tags and variables to automatically convert data layer events to TikTok Pixel events, and is best fit for websites already using a GTM data layer to send custom event data, such as using gtag() or dataLayer.push() APIs. Learn more about setting up TikTok events with Google Tag Manager data layer APIs.
Review the pending changes to your Google Tag Manager account and confirm the account information is correct. Please note:
Once the changes are published, they cannot be modified.
If your GTM workspace already has tags, variables, or triggers with the same names as the changes being published, those will be skipped to preserve your existing production GTM settings.
If you want to make any modifications to the published version or reset TikTok tags, variables, or triggers, see our Developer Help Center for instructions on reinstallation.
Select Publish to automatically install the tags, triggers, and variables necessary for TikTok Pixel to work properly on your website. For more details on what will be installed, see Changes made to your GTM account.
Once changes are published, the TikTok Pixel tag will be installed on your website. Refresh your website for the changes to take effect.
Now that you have the TikTok Pixel code installed, you can complete event setup through your selected method: Event Builder or Google Tag Manager data layer APIs.
Event Builder: Select Launch Event Builder to launch the tool. Follow the steps outlined in our Event Builder guide for Google Tag Manager to create events for the desired pages and elements on your website (eg. Add to cart button)
Google Tag Manager Data Layer APIs: If you previously selected GTM data layer as the event setup method, please follow the steps in our Developer Help Center to set up TikTok events with GTM data layer.
After completing installation of TikTok Pixel with Google Tag Manager, you can verify successful setup using TikTok Events Manager's test event tool, the TikTok Pixel Helper extension, or by using Preview mode on Google Tag Manager to validate tags are working properly. See 'Verify Google Tag Manager Setup' later in this article for more details.
These steps outline how to set up TikTok Pixel through your Google Tag Manager account via the TikTok Pixel (client-side) template.
Login to your Google Tag Manager account.
Navigate to Templates > Search Gallery and search for the TikTok Pixel template by TikTok.
4. Select Add to workspace to import the template into your workspace.
5. Save and close the template editor.
Copy your TikTok Pixel Base code from your Events Manager.
2. Go to your Workspace > Select Tags > Select New.
3. Name your tag (e.g. TikTok Pixel Base Code) > Click Tag Configuration > Select Custom HTML.
4. Copy the Pixel Base Code from TikTok and paste it in the HTML field > Set the trigger to All Pages.
After installing the base code, if you plan to trigger any one of our supported TikTok Pixel events according to your user journey, simply follow the steps below. For every event you wish to create:
1. Go to your Workspace > Select Tags > Select New.
2. Give your Tag a name e.g. TikTok ViewContent > Select the template you have just imported (TikTok Pixel).
3. You should then be able to choose from the 14 events you wish to trigger.
4. Finally, set a Trigger of your choice. For consistency, it is recommended to select the Google Tag Manager custom event you are invoking on your page. Then, save your tag.
After you complete integration of TikTok Pixel with Google Tag Manager, you can verify the setup using TikTok Events Manager's Test Event tool, TikTok Pixel Helper, and in Google Tag Manager Preview mode.
Using TikTok Pixel Helper: You can install the Pixel Helper extension in your Chrome browser to view installed pixels and review the events triggered in real-time. Learn more about TikTok Pixel Helper.
Using Test Event Tool in Events Manager: The tool allows you to load a browser session in test mode and see the events received by TikTok in real-time as they are sent from your website. Learn more about Events Manager's Test Event tool.
Using Google Tag Manager Preview mode: Enter the preview mode by clicking the "Preview" button in your web container in which TikTok Pixel tag is installed. Interact with your website and verify that the TikTok Pixel tag correctly gets triggered on events you configured (through TikTok Event Builder or GTM data layer).
If you set up events using GTM data layer (link to dev doc), you can also validate the Data layer values sent from your website to the web container.
Advanced Matching is available via TikTok Business Tools to enable businesses to send privacy-safe customer information to better match website events with ads on TikTok. We recommend passing hashed emails and phone numbers for web events from your Data Layer to increase the efficacy of ad performance and attribution on TikTok. Learn more about setting up Advanced Matching in our Developer Help Center under 'User data'.
If you have enabled Google's Enhanced Ecommerce or Standard Ecommerce to track online shopping events in your Google Analytics, you can leverage the ecommerce Data Layers to pass additional parameters to TikTok, to enable products such as Video Shopping Ads and Value-Based Optimization (VBO). Learn more at our Developer Help Center.
If you are not using any Google Enhanced Ecommerce of Standard Ecommerce, you may pass additional parameters back to TikTok using Data Layers. Learn more at our Developer Help Center.
You don't have a GTM account, Unable to find container, Unable to find workspace: Make sure you have not deleted the account and workspace in your Google Tag Manager. If your account list is null and you have deleted the default container as well, you will get one of these error messages.
Unable to find account: If the path of the first account in your list is null, then you will get this error message.
Pixel binding GTM failed: Make sure you are not installing a pixel which has already been connected to your GTM account, otherwise you will get this error message. Please check your Google Tag Manager account to confirm whether the pixel has been installed prior (repeated installation of pixels may result in repeated event data recorded).
No data appearing in Events Manager: Even though you have connected the TikTok Pixel to your Google Tag Manager successfully, if the container you chose has not been installed onto your landing page correctly, the TikTok Pixel will not record data properly.
Events not created: While events will pre-populate upon creation of the pixel, events must be defined before anything starts reporting. Learn more about how to create events.
If you have any questions - please contact TikTok Ads Customer Support or reach out to your TikTok Sales Representative.
If you have any feature requests or issues, please file a request in GitHub here.