Want to learn how to add YouTube videos in the Divi theme?
Created by Elegant Themes, Divi is a popular choice for tons of people who want to design a beautiful website.
And if you want to make your website even more engaging, you can try embedding YouTube videos.
But adding YouTube videos to Divi can be tough — especially if you’re not experienced in web design.
The good news? In this post, we’ll show you the simplest way to display YouTube videos on Divi websites.
Before that, let’s look at how embedding YouTube videos can help your website.
Or you can click here to skip to the tutorial.
Why Embed YouTube Videos in Divi?
Using the Divi theme, you can create a beautiful website with ease with the help of the visual builder. It can be a useful option for web design if you’re new to WordPress.
Once your WordPress website is ready, you can use YouTube videos to boost your engagement even more.
By displaying a YouTube feed in Divi, you can show relevant video content and keep your visitors on your website. When people spend more time on your site, this can boost your SEO as well.
And that’s just the start! Here are a few more amazing ways a YouTube Divi feed can help your website:
- To boost your conversions, you can show a video feed with positive reviews and testimonials for your products.
- You can embed a YouTube channel feed and promote your own video content to get tons of views and subscribers.
- If you want to run a successful live event, you can use your YouTube feed to promote your livestream on your Divi website.
- By embedding YouTube feeds, you can show video content to visitors without spending any server space of your own.
As you can see, you can embed videos in Divi to boost your social media presence, engage your visitors, and grow your business.
With that, let’s go ahead and see how you can embed YouTube videos in the Divi theme.
Easiest Way to Embed YouTube Videos in the Divi Theme
If you want to display YouTube videos on your website with ease, you can simply use a YouTube feed plugin.
And the best option in the market that you can try is Smash Balloon’s YouTube Feed Pro plugin.
With YouTube Feed Pro, it’s easier than ever before to create, customize, and embed YouTube feeds on your website.
To help you get started, you can follow the 3-step guided flow, which will take you through the whole process in a few simple clicks — no need for HTML, CSS, or any embed code.
Plus, YouTube Feed Pro comes with tons of options when it comes to the type of YouTube content that you want to embed.
You can embed a YouTube channel, playlist, live streams, favorites list, and more.
On top of that, you also get a live feed editor that you can use to change how the videos look on your website.
You can control your layout, color scheme, header style, button design, and much more.
This plugin also has smart loading, which doesn’t autoplay videos and only loads them when a visitor clicks on it.
As a result, you can show tons of video content at once, and your site will still be lightning fast.
All in all, it’s the best YouTube feed plugin in the market and a great way to make your Divi website more engaging.
Ready to embed YouTube feeds? Grab the YouTube Feed Pro plugin right away.
Now we’ll go ahead and see how you can embed YouTube videos in the Divi theme with the help of this plugin.
How to Add YouTube Videos in the Divi Theme (Easily)
All you have to do is follow the step-by-step guide below, and you can add YouTube videos to your Divi WordPress site.
Let’s get started:
Step 1: Install YouTube Feed Pro Plugin
To get started, get your copy of the YouTube Feed Pro plugin here. Next, just install and activate the plugin on your site.
If you’re not sure how, you can follow this guide on how to install a WordPress plugin.
Now let’s go ahead and create a feed of YouTube videos in step 2.
Step 2: Create Your YouTube Feed
To display YouTube videos on your website, you can start by creating a YouTube feed using this plugin.
For that, navigate to the YouTube Feed » All Feeds menu from your WordPress dashboard and then click on Add New.
After that, you can select the type of YouTube videos that you want on your website. You can choose from 6 different options here:
- Channel: Show videos from a chosen YouTube channel
- Playlist: Pick a YouTube playlist and display the videos on it
- Favorites: Embed the videos that you’ve marked as your “favorites”
- Search: Display YouTube search results on your Divi website
- Live Streams: Use your feed to show live streams from YouTube
- Single Videos: Embed a feed of specific YouTube videos
To continue, select a feed type and click on Next.
For this example, we’ll go with a playlist feed type.
Now, you can go ahead and connect this feed to YouTube in step 3.
Step 3: Connect Your YouTube Account
By connecting your YouTube account, this feed can fetch videos from YouTube and embed them on Divi.
And the easiest way to connect your YouTube account is to add the API key.
Don’t have your YouTube API key yet? You can follow this step-by-step guide on how to create your YouTube API Key.
After that, paste the API key into the popup and then click on the Add button.
Now, you can pick the source for your YouTube feed. Depending on the feed type you picked, this can be a YouTube channel, playlist, search term, and more.
In this example, we’ll embed a Divi Youtube playlist.
For that, open the YouTube playlist on your web browser and then look for the URL at the top.
From the URL, simply copy the ID at the end.
Now, open your WordPress site once again to finish adding your source.
Finally, paste the code into the Playlist ID field and then click on Next.
With that, you’ve connected your feed to YouTube and added your source as well.
You can now go to step 4 and customize how the YouTube feed looks on your website.
Step 4: Customize Your YouTube Feed
Using the YouTube Feed Pro plugin, your feed will automatically inherit the design of your website right out of the box.
On top of that, you can also choose between 6 templates to import for your feed.
- Latest video
- Showcase carousel
To continue, select the template you prefer and then click on Next.
To help you customize your YouTube feed in detail, YouTube Feed Pro will now send you to the live feed editor.
On the left, you can find the customization panel that you can use to set your feed layout, color scheme, header design, load more button, and much more.
Whenever you make any changes, the live preview on the right will show how the YouTube feed looks in real-time.
To get started with the customization, click on the Feed Layout option on the left.
After you do that, YouTube Feed Pro will ask you to choose from 4 different layouts: grid, gallery, list, and carousel.
Let’s take a look at each layout below.
With the grid layout, you can show YouTube videos in simple rows and columns with uniform thumbnails.
As a result, it’s easy to show tons of YouTube videos in Divi with ease.
Next, there’s the gallery layout that turns your feed into a YouTube gallery with a large video at the top and smaller thumbnails below.
As you can see, this can put the focus on a single YouTube video.
Next, you have the list layout that can help you show YouTube video content in a single column.
That way, the video feed be highly visible and take up more space on your website.
Want to show your YouTube videos in a slideshow? Then you can pick the carousel layout here.
This can make your website even more interactive for your visitors.
After you select your feed layout, click on the Save button to continue.
Finally, click on the Customize button to continue editing the design of your YouTube feed.
Next, you can use YouTube Feed Pro to change the colors of your feed.
For that, click on the Color Scheme option on the left.
YouTube Feed Pro comes with 4 color schemes that can easily change all the feed colors with ease:
- Inherit from Theme: Copy the colors of your Divi WordPress theme
- Light: Display a light background with dark font
- Dark: Embed a dark background with a light font
- Custom: Manually pick all the colors yourself
Once you finally choose your color scheme, confirm your changes by clicking on Save.
Now, you can use the remaining customization options to set your header design, button style, lightbox options, feed size, and more.
After you’re done with the customization, click on Save.
With that, it’s time to go to the final step and embed the YouTube feed on your Divi website.
Step 5: Embed YouTube Video Feed on Your Divi Website
Using this plugin, you can start embedding your YouTube feeds directly from the live feed editor.
To get started, click on the Embed button at the top.
Next, you’ll see a popup that contains all the video embed options for your YouTube feed. From here, you can embed your feed in a page, post, sidebar, and footer.
Here, click on the Copy button to continue.
To start embedding your feed on a WordPress page, open the Pages » Add New menu from your dashboard.
From the page editor, click on the Use The Divi Builder button.
Want to use a WordPress post instead?
From your dashboard area, navigate to the Posts » Add New menu and then click on Use The Divi Builder.
After that, you can choose between 3 options to start designing your Divi page or post:
- Start Building: Start from a blank template
- Browse Layouts: Import a pre-built layout
- Choose Page: Select a page and copy its design
To continue, just select the option you prefer.
With the Start Building option, you can immediately start designing the page or post.
If you selected the Browse Layouts option, you can browse your pre-existing layouts on the Load From Library popup.
On the popup, just click on the layout that you prefer.
This will show you more details about that layout.
To select this layout for your page or post, click on Use This Layout.
If you go for the Choose Page option, the popup will show you all the page designs that you’ve created using Divi.
To continue, just click on one of the pre-made layouts on this popup,
Now, you can start adding your YouTube videos to this Divi page builder.
First, click on the green plus icon (+) to create a new row to place your YouTube feed.
After that, you can choose the type of row you want to add.
Next, click on the plus (+) icon to open the Insert Module popup. Using this, you can add content to the Divi theme.
In the search bar at the top, look for the “code” module. After that, click on the Code module from the results below.
Once you do that, look for the code field on the left and then paste the shortcode for your YouTube feed.
Finally, click on the check icon at the bottom to save your changes.
With that, you’ve added YouTube videos to your Divi WordPress site. You can now click on Publish, and your feed will be live on your site.
To see how it looks to your visitors, you can open your page or post and take a look.
And that’s it!
Now you know how to add YouTube videos in the Divi theme. As a result, you can keep website visitors engaged and convert them into customers.
With the YouTube Feed Pro plugin, you can embed YouTube videos in your Divi website in just a few easy clicks — no need to touch a single line of code.
Ready to embed a YouTube video into WordPress Divi? Get YouTube Feed Pro today!
If you want to use Twitter for your business, you can look at our list of the best Twitter marketing tools.
If you found this article to be helpful, give us a follow on Twitter and Facebook, and stay tuned for more social media marketing tips and tricks.