React Tiktok Pixel

React JS wrapper for Tiktok's Pixel

Install

1npm install --save tiktok-pixel
2

or

1yarn add tiktok-pixel
2

How to use

1import TiktokPixel from 'tiktok-pixel';
2
3const advancedMatching = {
4  email: 'some@email.com',
5  phone_number: '0123456789',
6}; // optional, more info: https://ads.tiktok.com/help/article?aid=10007891
7
8const options = {
9  debug: false, // enable logs
10};
11
12TiktokPixel.init('yourPixelIdGoesHere', advancedMatching, options);
13
14TiktokPixel.pageView(); // For tracking page view
15TiktokPixel.track(event, data); // For tracking default events. More info about standard events: https://ads.tiktok.com/help/article?aid=10028
16
17const trackingOptions = {
18  event_id: 'some ID', // optional
19};
20
21TiktokPixel.track(event, data, trackingOptions);

Running the example

1yarn build
2cd example
3yarn start
4

Event Types

Event type	Recommended parameters
AddPaymentInfo
AddToCart	content_type, quantity, description, content_id, currency, value
AddToWishlist
ClickButton
CompletePayment	content_type, quantity, description, content_id, currency, value
CompleteRegistration
Contact
Download
InitiateCheckout
PlaceAnOrder	content_type, quantity, description, content_id, currency, value
Search
SubmitForm
Subscribe
ViewContent	content_type, quantity, description, content_id, currency, value

Parameters

Parameter	Description	Value type
content_type	The content_type object property's value must be set to either product, or product_group, depending on how you will configure your data feed when you set up your product catalog. If you will be tracking events associated with individual products, set the value to product. If you are tracking events associated with product groups, set it to product_group instead.	Must be either product or product_group.
content_id or contents	Use contents when you have multiple content IDs. If you use contents in your parameter, you must also include the following in a sub-object: the product id or ids, and the quantity (number of items added to cart or purchased).	Must be a string if using 'content_id.' Must be an array of objects (content parameter, id sub-object and quantity sub-object) if using 'contents'
content_category	Category of the page/product	string
content_name	Name of the page/product
string
currency	SO 4217 code. List of currencies currently supported: AED, ARS, AUD, BDT, BHD, BIF, BOB, BRL, CAD, CHF, CLP, CNY, COP, CRC, CZK, DKK, DZD, EGP, EUR, GBP, GTQ, HKD, HNL, HUF, IDR, ILS, INR, ISK, JPY, KES, KHR, KRW, KWD, KZT, MAD, MOP, MXN, MYR, NGN, NIO, NOK, NZD, OMR, PEN, PHP, PHP, PKR, PLN, PYG, QAR, RON, RUB, SAR, SEK, SGD, THB, TRY, TWD, UAH, USD, VES, VND, ZAR	enum(string)
value	Value of the order or items sold. Note: Price is the price for a single item, and value is the total price of the order. For example, if you have two items each sold for $10, the price parameter would pass 10 and the value parameter would pass 20.	number
price	The price of the item. Note: Price is the price for a single item, and value is the total price of the order. For example, if you have two items each sold for $10, the price parameter would pass 10 and the value parameter would pass 20.	number
quantity	The number of item(s).	number
query	The text string that was input by a user. For instance, if a person searches for a product on your website, you can forward the keyword being searched. If a person enters a coupon code at check out, you can forward the code.	string
description	Description of the item or page.	string
status	Status of an order, item, or service. Note: Depending on your use of 'status', Events API may be required in order to share status changes to TikTok.	string

Follow me on LinkedIn: @ertemishakk

Checkout this article for detailed explanation: React JS Wrapper for TikTok

Read about me : ishakertem.com