Are you looking to embed YouTube videos on your website? In this blog post, you will learn how to automatically display the latest videos from your YouTube channel on WordPress, Squarespace, Wix, Webflow, Shopify, and any other website builder.
Believe it or not, YouTube is the most popular website worldwide. A stunning 1 billion hours of YouTube videos are watched every day.
Therefore, it shouldn't surprise that website owners are looking for tools to embed YouTube videos on their websites and get more eyeballs and followers for their content – and all that without manual work when a new video is published on the YouTube channel.
The good news is: you don’t need to be an expert in HTML or have developer skills to embed your YouTube channel on any website! With a social media aggregator, embedding your YouTube channel feed takes a few minutes.
In this article:
Why do brands embed YouTube channels on websites?
Embed YouTube videos on any website
Customize your YouTube feed
How to embed YouTube channel on WordPress
How to embed YouTube channel on Wix
How to embed YouTube channel on Squarespace
How to embed YouTube channel on Webflow
How to embed YouTube channel on Shopify
Why do brands embed YouTube channels on websites?
Brands embed social media feeds on websites to keep their site fresh with new content – social media feeds help increase the time spent on site.
But there are a few additional reasons why your organisation should embed YouTube video feeds on websites:
1. Drive subscribers to your YouTube channel
There are 38 million channels on YouTube, and the competition for attention is fierce. Therefore, it is essential to promote your channel on existing websites and mobile apps that you already have in place. The more eyeballs on your videos, the more likely you will grow the subscriber count as well.
2. Increase sales
According to statistics, videos help increase sales by 34%. Videos make it easier and faster to learn more about a new product and service than text or even images.
Especially, customer testimonial videos embedded with a UGC Platform truly resonate with new customers. Social proof and user-generated content from our friends and peers helps us to make the purchase decision.
3. Improve SEO with YouTube videos
Lastly, YouTube has become one of the largest search engines, and the more popular your videos are, the more YouTube will promote them in the future. YouTube videos show up in Google’s search results as well.
Embed YouTube videos on any website
There are two ways how you can add YouTube videos to your website:
- Use the YouTube video embed code and add YouTube videos to any page manually.
- Collate YouTube video feeds with a social media aggregator and embed a live updating YouTube feed on any website.
1. Add YouTube videos to any page manually
If you want to show just one video on your website’s page and not change it too often, embedding the YouTube video HTML on your website is a good option. Here’s how you can find the YouTube video embed code:
- Open the video on YouTube.
- Click the 'Share' button and then choose 'Embed' from the available options.
- Then, copy and paste the YouTube video HTML on any website and article.
2. Embed YouTube channel on any website
Most marketers and website managers are busy and want to avoid additional manual work. That’s when an automatically updating YouTube video feed is the right choice.
Here are five simple steps on how to embed a YouTube channel feed on any website:
Before getting started, and if you don’t have a social media aggregator yet, sign up for Flockler’s free trial.
Step 1: Log in to your Flockler account and go to the 'Automated Feeds' tab in the navigation. Then, click the 'Create a new automated feed' button.
Step 2: Select 'YouTube' from the available sources and log in with your YouTube account.
Step 3: Choose 'YouTube channel/playlist' (yes, you can embed a YouTube playlist and videos by a keyword, too!)
Then type the name of the channel or add a link. You don’t need to be an admin of any specific channel.
Step 4: Decide if you’d like to display YouTube videos automatically or review them before embedding them on the website. If you are looking to show videos from your channel, then showing videos automatically is the recommended choice.
Step 5: The final step is to choose the YouTube feed layout. From Flockler’s Display tab, you can create Social Walls, Grids, Carousels, and Slideshows for your YouTube channel videos.
After choosing the layout, you will get an embed code for your YouTube video feed. You can add the embed code to your website’s HTML - including WordPress, Wix, Squarespace, Webflow, Shopify, and other website builders.
Customize your YouTube feed
With a few clicks and without developer skills, you can customize your YouTube Channel feed and make sure it perfectly fits your website and branding.
Depending on the page and digital service, you can choose a Wall, Grid, Carousel, and Slideshow. You can create as many layouts as you like and then edit the features of each YouTube feed:
- Show/hide YouTube video caption texts
- Show/hide YouTube profile information
- Show/hide timestamp
- Select the language
- Choose how many YouTube videos are shown
- Enable/disable infinite scroll
- Open the YouTube video in a popup
- Use custom colours
- Add custom CSS
- Filter YouTube videos by a hashtag
- Add CTA buttons
- Tag videos with products from your webshop
Embedding YouTube videos on a website builder
With the instructions above, you can embed a YouTube channel on any digital service and here are detailed step-by-step tutorials for some of the most common website builders:
How to embed YouTube channel on WordPress
Start by downloading Flockler’s WordPress plugin for social media feeds. Then, follow the instructions below for Elementor, Gutenberg, and the Classic editor.
Embed YouTube channel on Elementor
- Add a new page on WordPress or edit an existing one.
- Click on Edit with the Elementor button.
- From the left, search for the HTML widget.
- Drag and drop the HTML widget into your page.
- A new set of editing tools on the left will open. Copy and paste your Flockler plugin shortcode for YouTube channel directly into the HTML Code field.
- Update/Publish the Page.
Embed YouTube channel using Gutenberg
- Open the Post or Page in the WordPress admin where you’d like to embed a YouTube feed.
- Choose "(+) Add Block" in the top left corner of the WordPress editing tools.
- Next, search for the Custom HTML element and add it to your Page.
- Copy and paste your YouTube video embed shortcode from Flockler’s Display tab to the element.
- Update/Publish changes to the WordPress Post/Page.
Embed YouTube channel using the Classic editor
- Open the Post or Page in the WordPress admin where you’d like to add a YouTube feed.
- In the WordPress content editor, you’ll find options to use a Visual or Text mode. Choose Text mode.
- Copy and paste your unique shortcode from Flockler’s Display tab to where you would like to display the YouTube feed on WordPress.
- Update/Publish changes to the WordPress Post/Page.
That’s it – if you have followed the steps above, a custom YouTube video feed is now embedded on your WordPress site!
How to embed YouTube channel on Wix
On the Wix website, you can use the classic editor or Wix ADI and here are step-by-step instructions for both.
Embed YouTube channel using Wix’s classic editor
In the Wix Editor, click the + button on the left, select ‘Embed’ and then ‘Embed a widget’ from the available options.
Resize the element and then click the ‘Enter Code’ button.
Go to Flockler’s ‘Display’ tab and copy and paste the YouTube feed embed code to Wix’s editor.
Click the ‘Update’ button, and your Flockler layout appears on the page.
Embed YouTube channel using Wix ADI
Open the editor and click + icon on the page and select the position where you’d like to embed the YouTube feed.
Then select ‘HTML Embed’ and one of the ready templates.
Edit or remove the default texts and click ‘Settings’ next to HTML.
Make sure you select ‘Website’ from the two embed types and add the ‘Preview’ URL of Flockler to the editor. You can find the ‘Preview’ URL from Flockler’s Display tab. While you are on the editor, you can change the width and height available for the Flockler layout.
That’s all – click to ‘Publish’ your website, and the YouTube video feed shows up on your Wix site.
How to embed YouTube channel on Squarespace
Note that you’ll need a Business plan for Squarespace to add any third-party widget.
Click to 'Edit' the page where you’d like to add a YouTube feed.
Then add an element.
Click + icon – a set of options opens up. Search and select the ‘Code’ block.
In the ‘Code’ block, make sure you’ve got ‘HTML’ selected from the dropdown and that you have NOT selected ‘Display source’. Paste YouTube feed embed code to the field and click 'Apply'.
Next, you should see the element saying ‘Script Disabled’. Don’t worry, that’s standard behaviour on Squarespace.
Save changes and publish the site – the YouTube channel embed will then show up on your Squarespace site!
How to embed YouTube channel on Webflow
Note that you’ll need a paid Webflow plan to add a third-party widget to Webflow.
Select an area where you’d like embed YouTube videos. Then just click the + icon, scroll down to the Components section, and select the ‘Embed’ button.
After selecting the ‘Embed’ component, an editor opens up. Add the embed code from Flockler’s Display tab to the editor and save changes.
Remember to publish your updated version of the Webflow site, and your YouTube channel is live on the page!
How to embed YouTube channel on Shopify
In general, you can embed YouTube feeds on any Shopify page, for example, to the homepage, all product and collection pages, or any individual page. I’ll go through all the various options next.
Embed YouTube channel on Shopify homepage
To add a Youtube channel to any Shopify page, you’ll need to edit the theme layout. Go to Themes, click ‘Actions’ and select ‘Edit code’.
Go to 'Sections' and click 'Add a new section'.
Give it a name (e.g., flockler), and an editor opens up.
In the editor, replace the Section name with "flockler". Also, replace all after 'endschema' with Flockler’s embed code that you can find from Flockler’s Display tab.
Save changes.
Next, scroll up the list to 'Templates', click 'index.json'.
An editor opens and you need add the following section at the top:
"flockler": {
"type": "flockler"
},
Scroll down the code editor, and you’ll find the order of homepage elements. Choose the right spot for Flockler and add it to the list.
Click ‘Save’, and you are all done! The YouTube channel feed will be displayed on the Shopify homepage.
Embed YouTube feed on Shopify Collections and Product pages
If you’d like the Flockler embed code to show on all collections and product pages, you can follow the above instructions. Here, the 'collection.json' and 'product.json' define layouts for all collections and products, and you can add a YouTube feed to either of them.
Embed YouTube videos on a specific Shopify page
One option is to embed YouTube videos on the individual page content. From the text editor, click the ‘HTML button’.
Then add Flockler anywhere in the text.
Finally, click 'Save' and the YouTube video feed is embedded on an individual page.