This article refers to an outdated Tag Rocket API Script. We have since upgraded Tag Rocket to include TikTok tracking within our core suite of tracking. To learn more about it, and how to configure, go to our Tag Rocket TikTok Ads page.
Setting up the TikTok tracking pixel and their supported events on BigCommerce is simple when using Tag Rocket. Here are the steps to get you started.
Install And Publish Tag Rocket
You will need the Tag Rocket code on your website in order to use its API (TRAPI) to help you add the TikTok pixel and fire dynamic conversion events.
- Install the app from the app store
- Switch to the Dashboard
- Scroll down and select the settings for the Global Tag Values section
- Scroll down to find the Tag Rocket API section
- Check the “Fire All Events” option.
- Finish Editing
- Click Publish to add its code to your store.
Creating the TikTok Pixel
Once you have a TikTok For Business account go to the Website Pixel Management page. Assets->Event->Website Pixel Manage.
If you already have a Pixel set up then just copy its ID and move on the the next section. The existing pixel has to be using the “Developer” Setup Method. You can find this out by clicking on the Pixels name.
If not, then add the pixel with the following steps:
- Click Create Pixel
- Give it a name, like “Tag Rocket”
- Select “Manually install pixel code”
- Next
- Select “Developer Mode”
- Set Advanced Matching to on or off
- Confirm
- Copy the pixels ID
You will also want to connect the Pixel to your catalog. This is done under Assets->Catalog. Select your catalog then go to Event Sources and make the connection.
Adding The TikTok Code
Once you have Tag Rocket published you can use it to set up your TikTok tracking. In the Store Front->Script Manager Section add a Script with the following settings:
| Name of script | Tag Rocket TikTok |
| Description | TikTok pixel and events |
| Location on page | Head |
| Select pages where script will be added | All pages |
| Script category | Targeting;Advertising |
| Script type | Script |
Then add the following script into the “script contents”. Make sure you change the REPLACE_WITH_YOUR_ID text with your TikTok Pixel ID.
Note that you can change the productIdentifier function so that it uses the same product identifiers as in your catalog. Check your catalogs “SKU ID” field to see what values you are using.
Testing
The Chrome Browser TikTok Pixel Helper from TikTok will show you which events fire on your pages and if the data is valid.
After a while you should see event data showing up in the Pixels details page.
In the Event Sources section of your Catalog you should start to see the Event Availability settings go green.