Video Playlist Elementor

Home Elementor How to Embed a YouTube Playlist in Elementor with JetBlog Plugin

How to Embed a YouTube Playlist in Elementor with JetBlog Plugin

• By: Editorial Staff

If you are a YouTuber and have a website created with WordPress+Elementor, you might want to embed your YouTube playlists to your website. Unfortunately, Elementor has no default widget to allow you to embed a YouTube playlist on your website. All Elementor has is a Video widget, which only allows you to embed a single YouTube video. To embed a YouTube playlist in Elementor, you can use JetBlog. What is JetBlog?

JetBlog is an Elementor add-on developed by Crocoblock. This add-on is designed to help you to create an online magazine or news website. JetBlog add-on adds 6 new widgets to your Elementor, including Video Playlist which you can use to embed a playlist from YouTube.

How to use JetBlog to embed a YouTube playlist in Elementor

Please note that you can only embed a YouTube playlist of your own. You cant embed a YouTube playlist from other users. Also, you need to set the playlist as a public playlist instead of private.

Before being able to embed a video playlist from YouTube, you need to create a YouTube API key first.

# Creating the YouTube API Key

Visit Google API Console and login with your Google account. Select a project from the dropdown menu on Select a project. If you havent had a project yet, create a new one by clicking the dropdown menu and click NEW PROJECT.

Give your project a name and click the CREATE button.

With your new project selected, click Library on the left panel.

Scroll down to the YouTube section and select YouTube Data API v3.

Click the ENABLE button to enable the API key for your project.

Click Credentials on the left panel, followed by Create credentials button and select API key.

Copy the API key.

Login to your WordPress dashboard and go to JetPlugins -> JetBlog Settings. Paste the API key you have just copied to the YouTube API Key field.

# Embedding the YouTube playlist

Once done with the YoTube API key, you can start embedding your playlist. To do so, create a new page or post and edit it with Elementor [of course, you can also edit an existing page]. Add the Video Playlist widget by dragging it from the left panel to the canvas area.

Under the Content tab on the left panel, set the source to YouTube Channel or Playlist and paste the URL of YouTube playlist you want to embed.

You can set the number of videos on the playlist by changing the number on Number of videos [see the screenshot above].

By default, thumbnails orientation is set to vertical. You can set it to horizontal. To do so, open the Settings option under the Content tab. Set the orientation of the thumbnails on the Thumbnails Orientation section. From here, you can also set the playlist height.

There are several other settings you can set, including the thumbnails position, thumbnail list width, heading text, heading icon, counter suffix, and so on. Just play around and try each setting.

# Customizing the playlist

Once done with the basic settings, you can customize the look of your playlist. To do so, go to the Style tab on the left panel.

There is one thing you need to note before start customizing your playlist. By default, texts and background are set to white. So, if you click the preview button without making any setting on the Style tab, your playlist will look like the following.

You can start customizing your playlist by setting the background of the canvas, thumbnails, and heading.

You can then set the typography of the heading title. To do so, you can g to Heading Title section. Click the pencil icon to open the typography controller and click the color selector to set the text color of the heading title.

To customize the thumbnails, you can open the Thumbnail Styles option. From here, you can set things like the gab between thumbnails, the typography of the title of each video on the playlist as well as the color and so on.

To set the gab between thumbnails, you can set the top and the bottom paddings.

To set the typography of the title of each video on the playlist, you can click the pencil icon on the Title section.

To change the color of the text of the video titles, you can click the color selector on the Title Color section. You can set the color of the title on the normal condition, hover and active.

There several other settings you can set, you can play around until you get satisfied with the results. Once you are done, you can click the PUBLISH/UPDATE button to apply your playlist on your page.

The bottom line

JetBlog is a great add-on if you need to embed a YouTube playlist on your Elementor-based website. This add-on comes with a Video Playlist widget which you can use to embed a YouTube playlist. In addition to embedding a YouTube playlist, you can also create a new playlist by setting the source to Custom Video List.

JetBlog itself is a premium Elementor add-on, costing you $15 per year for a single website. If you are the sort of person who hates the subscription-based business model, you can get JetBlog by using the Monstroid2 WordPress theme. This theme is bundled with JetBlog and other Elementor add-ons developed by Crocoblock. You can get this theme with a one-time purchase option.

• jetblog, jetplugins