Tiktok Integration
Shopify Storefront data and cart logic is bound to your Webflow elements through Shopyflow attributes. Connecting your Webflow site to Shopify is done by adding custom attributes to your Webflow elements.
Yet, you are not required to type or edit attributes manually. Shopyflow provides you with the pre-configured components needed to create your store, as copyable Webflow elements right in Webflow designer.
All the copyable Shopyflow Components are native editable Webflow elements. There is no layout or styling limitation on any element.
In the below image hover your mouse on the hotspots to see all the required Shopyflow attributes to build a product page like this in Webflow
TikTok offers a unique platform for Shopify store owners to reach a younger, highly engaged audience through short, creative videos. It’s a powerful tool for viral marketing, helping brands increase visibility and connect with potential customers in a fun and engaging way. Follow this guide to learn how to track Tiktok events in your Webflow site.
- First off, we need to enable Tiktok Pixel in Shopify. Go ahead and install the Tiktok Shopify App.
- Next, we need to enable Tiktok Pixel in Webflow. Go ahead and paste the Tiktok Pixel code you got from Tiktok Ads Manager into Webflow page settings, in head code. If your site has to be GDPR compliant, you need to delay loading Tiktok until your customers give their consent. You can achieve this by using a solution like Finsweet's cookie consent.
- Make sure you are using the same Pixel ID in Shopify and in Webflow. Find your Pixel ID in the code snippet you pasted in Webflow (see image below) and change it with your Pixel ID Shopify (usually 20 characters long. e.g. CP234SBP71UELKHAP9F0).
- After the change the line in Webflow should look like this containing the Pixel ID from Shopify: ttq.load('CP234SBP71UELKHAP9F0');
- Finally, go to Shopyflow Webflow App > Installation > Advanced Tracking and enable Tiktok.
- Publish your site.
Once the site is published, Shopyflow will start tracking the following Tiktok events:
- View Content
- Add to Cart
- Remove from Cart
- Initiate Checkout (via Shopify in checkout)
- Add Payment Info (via Shopify in checkout)
- Purchase (via Shopify in checkout)
Webflow app usage
Webflow app settings
Inner components
Module contents
Available methods
Integration
contents
State management
Related Utilities
