How to Embed a YouTube Playlist in WordPress

Embed YouTube Playlist in WordPress

I recently demonstrated 4 different ways to embed a YouTube video in WordPress. Now you might be asking, “How do I embed a YouTube playlist in WordPress?” You’ll be happy to know it’s quite easy, and the process is not that much different from embedding a single video. Let’s take a look.

Animation of a YouTube playlist WordPress embed
Animation of a YouTube playlist embed

There are 4 main ways to embed a YouTube playlist in WordPress:

  1. Using oEmbed (easiest)
  2. Using the embed shortcode (a few more options)
  3. Using an <iframe> (a lot of customization)
  4. In your WordPress sidebar

Getting a YouTube Playlist URL

Before we can embed a YouTube playlist, it’s helpful to know how to get the playlist URL. This is just a little different from getting a video URL.

  • From any page on youtube.com, open the menu from the top-left corner
  • Under Library, click on the playlist you want to embed
YouTube playlist icon in sidebar
The playlist icon in YouTube’s new design (Summer 2017)
  • This will take you to the main playlist page
  • The URL should look like this
https://www.youtube.com/playlist?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G
  • Copy that URL to your clipboard

Alternatively, if you’re watching a video within a playlist, you should see the playlist name on the right side of the screen. Clicking on the playlist name will take you to the same URL.

YouTube playlist name in sidebar

Now we’ll get into the various ways to embed the playlist on your WordPress site.

01 Easiest Way to Embed a YouTube Playlist in WordPress

The easiest way to embed a YouTube playlist is to simply paste the playlist URL into the visual editor. Make sure you’re using the Visual editor, and not in Text mode.

Then just paste the YouTube URL on it’s own line, and WordPress will automatically add the embed code for the playlist. You should see a preview right there in your visual editor.

YouTube playlist embed in visual editor

This works because of a technology called oEmbed. There are other types of content you can insert into WordPress just by pasting the URL in your post screen. Learn more about WordPress oEmbeds »

02 Embed YouTube Playlist in WordPress using a shortcode

If you’d like to set a maximum width or height on your playlist, you can use the embed shortcode. The instructions are exactly the same as embedding videos, so hop on over to our YouTube video embed tutorial to learn about this method.

03 Embed YouTube Playlist in WordPress using an <iframe>

Using an iframe to embed a YouTube playlist provides you with more flexibility over how the playlist is displayed.

First, I’ll show you how to embed the playlist, and then I’ll explain the available options and how to set them up.

NOTE: This is currently only available in the classic version of the YouTube design. If you’ve enabled the new design, this method is not yet available.

How to use the <iframe> method

  • On YouTube.com, navigate to the playlist you want to embed
  • Click on Share
  • Then click on Embed

YouTube playlist embed/share iframe code

  • Clicking Show More will provide you with a few additional options, which we’ll discuss in a moment
  • Copy the <iframe> code
  • Go back to your WordPress editing screen, and click on the Text tab
  • Paste the code on it’s own line, where you want the video to appear

The most basic code will look something like this:

<iframe width="560" height="315" src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G" frameborder="0" allowfullscreen></iframe>

(Optional) You can remove the width and height parameters to force the playlist to automatically fit inside of its container.

How to customize a YouTube playlist via the URL

Now I’ll show you how to customize the way in which the playlist appears on your site.

Here is a list of URL parameters you can add to the end of the <iframe> src attribute, and what they do:

  • allowfullscreen – This is not a URL parameter, but you remove this attribute from the <iframe> to disable fullscreen mode
  • controls=0 – Hides the player controls (play/pause, volume, captions, settings, fullscreen, etc.) at the bottom
  • showinfo=0 – Hides the playlist title & sharing options at the top
    NOTE: This kind of defeats the purpose of embedding a playlist, because it removes the option to open the playlist up and view all videos.
  • autoplay=1 – Starts playing the 1st video in the playlist automatically, when the page loads
  • loop=1 – As soon as the last video in the playlist has ended, it will start playing at the beginning of the playlist again
  • disablekb=1 – Disables the keyboard controls
  • cc_load_policy=1 – Automatically turns on captions
  • modestbranding=1 – Removes the YouTube logo from the control bar
  • Privacy-enhanced mode – This is done by checking the “Enable privacy-enhanced mode” checkbox. The URL changes from www.youtube.com to www.youtube-nocookie.com.

View a full list of parameters & explanations »

Examples

Disable fullscreen mode (note “allowfullscreen” has been removed):

<iframe src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G" width="640" height="360" frameborder="0"></iframe>

Hide player controls controls=0:

<iframe src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G&controls=0" width="640" height="360" frameborder="0" allowfullscreen></iframe>

Hide playlist title & sharing options showinfo=0:

<iframe src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G&showinfo=0" width="640" height="360" frameborder="0" allowfullscreen></iframe>

Autoplay the 1st video in the playlist on page load autoplay=1:

<iframe src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G&autoplay=1" width="640" height="360" frameborder="0" allowfullscreen></iframe>

Automatically loop the playlist loop=1:

<iframe src="https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G&loop=1" width="640" height="360" frameborder="0" allowfullscreen></iframe>

You can combine as many of these options as you’d like, just adding an & between each one. Your src attribute would look something like this:

https://www.youtube.com/embed/videoseries?list=PLJ62e5IH_smtK4DDW6qTeoAoaBpr3vY0G&controls=0&showinfo=0&autoplay=1&loop=1

04 How to Embed a YouTube Playlist in your WordPress Sidebar

Unfortunately, the new video widget in WordPress 4.8 does not support embedding playlists. Therefore, you’ll have to use the <iframe> method described above, and insert the <iframe> code into a Text Widget. Here’s a quick animation:

Animation of embedding YouTube playlist in WordPress sidebar

  1. Navigate to Appearance > Customize (you could also go to Widgets, but Customize shows you a real-time preview)
  2. Click on Widgets
  3. Then find the sidebar area that you want to add the video to (you might have multiple sidebar areas listed)
  4. Click Add Widget
  5. Search for the Text widget, and click on it
  6. Switch from Visual to Text mode
  7. Paste your <iframe> embed code
  8. At the top of the Customizer, click Save & Publish

Gimme a shout in the comments if you have any trouble embedding a YouTube playlist on your WordPress site.

2 Commentson "How to Embed a YouTube Playlist in WordPress"

  1. /

    This was really helpful. Thank you!

    → Reply
    1. (Author) /

      You’re welcome, Diana. Glad you found it useful :-)

What Are Your Thoughts?

All fields are required. Your email will not be published.

You can use standard <code> and <pre> tags to post code examples, or a service like codepen.io.