How To Embed TikTok Videos To Any Shopify Page For Free
September 2016 introduced an all-new subculture for Gen Z’ers as it was the year that brought in one of the most highly leveraged social media platforms, especially for teens! Yes, we are talking about the platform that caused a stir in the social media landscape – TikTok.
Talking in numbers, TikTok has over 680 million monthly active users worldwide and has been downloaded over 2 billion times on the App Store & Google Play!
The addictive TikTok allows its users to create short videos ranging from 15 seconds to 3 minutes using funky music, quirky filters, funny backgrounds, and interesting audio.
Since videos are much more engaging and descriptive than texts, embedding such content on E-Commerce sites like Shopify can significantly help in increasing your sales and conversions.
In this tutorial, I'm going to teach you how to embed TikTok videos into your Shopify store for free - without an app.
Step 1: starting
We always recommend making a copy of your theme. Once you are in your admin panel, you have to go to Online stores, and in the theme where you want this new feature, click Actions, and then click Duplicate.When you have done this part, you can start to develop.
Step 2: Getting the video from TikTok
Go to tiktok.com from the desktop and find the video you want. Next to the video, you will see an arrow to share this video, click there, and a new pop up will appear. Select Embed, and click on copy code.
Step 3: add the video
Once we have the video in our clipboard, and our theme duplicated, click on Actions on this theme, then select Edit code. Now we have to find the place where we want to add this video, for example, we will add it on the product page. To do that search under the Sections directory in the left sidebar and choose product-template.liquid. Paste the code from TikTok where you want it to be shown and click on save.
Step 4: Testing
Open your site in a new tab and open a product page, you will see the video there.
Step 5: another option
If you want a different video for each product, you will have to add it to the Shopify product backend instead of the template. Go to products, then find the product that you want to add to this video. Open it and in description click on Show HTML., then paste your code where you want to be displayed (above or below the text). Make sure that the video is added. Thanks!
- How To Create CUSTOM PRODUCT OPTIONS on Shopify 2.0
- How To Open External Links In A New Tab - Easy Shopify Tutorial
- How To Add Before And After Slider To Shopify - Easy 2022 Tutorial
- How To Add a Background Video To Shopify For Free
- How To Embed TikTok Videos To Any Shopify Page For Free
- Create Product Bundles Without The App - 2022 Easy Shopify Tutorial!
- Add Back to Top Button on Shopify Using Code: Detailed Tutorial
- How to Add A Custom Cart Icon on Shopify Using Code: Detailed Tutorial
- How to Add Breadcrumb Navigation to Your Shopify Store: DIY Tutorial Using Code
- How to Add Sales Countdown Timer to Your Shopify Store
- Cumulative Layout Shift Optimization: Causes and How to Measure It
- Ask How Customers Heard About Your Store On The Cart Page - 2022 Shopify Tutorial
- How to create a simple Quick View without app usage to your Shopify store
- Add A Multiple Currency Selector to Your Shopify Store Using Code Tutorial
- How to Create A Page of Collections on Shopify Using Code
- Show The Number of Products Left in Stock on Your Shopify Product Page
- Change the Number of Products in the Collection Page- Shopify Tutorial
- DIY Guide to Embed A YouTube Video in Shopify Product Page Tutorial
- Add a Message to the Shopify Product Pages by Using Product Tags - 2022 Easy Tutorial
- How to Add a Delivery Date Picker to Your Cart Page - Easy Step-By-Step Shopify Tutorial
- How To Create A Stunning Parallax Scrolling Section In Your Shopify Store Tutorial
- 6-step Tutorial on How to Add Wholesale To Shopify Store Without Shopify Plus
- How to Add Banner Image to Product Pages Without The App - Quick Shopify Tutorial
- How to add Hover Effect on Main Navigation Bar In Shopify
- How to Add A Gallery Page to Your Shopify Store without the App
- Disable Right-click to Protect Your Images on Shopify Using Code - Tutorial
- How to Auto Hide Sold Out Products on Shopify: DIY Tutorial
- DIY Code: How To Add Continue Shopping Button To Your Shopify Cart Page
- How to Create Custom Product Options on Shopify Without the App in 2022
- How to Select Variants By Clicking Their Images on Shopify
- How to Create a Custom Note Field on Your Shopify Cart Page
- How to Enable Custom File Upload Product Options on Shopify
- How To Show An Alternate Product Image On Your Shopify - Easy Step-By-Step Tutorial
- Step-by-Step Tutorial to Set Up Facebook Messenger Chat On Shopify Without App
- DIY Code To Add a Size Chart to Shopify Product Pages
- How To Redirect Shopify Customers After Login, Logout & Account Creation
- 4 Steps to Create a Sticky Header on Shopify: DIY Code
- How to Add Featured Product Slider To Your Shopify Store: Step-By-Step Tutorial
- Shopify Product Description Tabs: 5 easy steps to create your own collapsable descriptions
- Shopify Quick ADD TO CART Button On Collection Page Without The App
- How To Add a CUSTOM FONT To Your Shopify Store