Custom thumbnails can really be useful for YouTube embeds but it gets even better with playlists. One particular use case for custom thumbnails on YouTube playlists are when you want to create a playlist from a set of videos yourself. In such cases, the thumbnail of the first video will be used by YouTube and it won’t be a good representation of what the playlist is actually about. Instead, you can replace it with a custom image which helps to increase the number of playbacks. This method also improves your web page performance by dynamically loading the YouTube player.
Embed someone’s YouTube playlist with a custom thumbnail
- Go to codegena youtube playlist embed code generator
- Enter the playlist URL in the URL field and fill in the player dimensions.
- Turn on “Load Async Player ” option. This should enable the thumbnail field located below.
- Enter the url in the thumbnail field and hit generate button located at the end.
It will generate a code snippet like the one shown below. You can also copy the following syntax and replace the variables manually.
<div class='youtube' id='videoseries?list=PLAYLIST_ID' data-params='&theme=dark&autoplay=1&autohide=2' src='IMAGE_URL' style='width:500; height:294;'></div>
<script src='https://codegena.com/assets/js/youtube-embed.js'></script>
In the above code snippet, replace PLAYLIST_ID
with the actual playlist id and IMAGE_URL
with the thumbnail image.
NOTE: Higher resolution images may cause the player to load slower.
Create a YouTube playlist from a set of videos and use a custom thumbnail for the playlist
If you want to create a YouTube playlist embed from a list of videos, you can do that by using the code syntax shown below.
<div class='youtube' id='VIDEO_ID' data-params='?&theme=dark&autoplay=1&autohide=2&playlist=ID_2,ID_3' src='IMAGE_URL' style='width:500; height:294;'>
</div>
<script src='https://codegena.com/assets/js/youtube-embed.js'></script>
Replace VIDEO_ID
with the first video you want in the playlist and ID_2, ID_3,..
with the rest of the videos you want in the playlist. Finally, replace IMAGE_URL
with the thumbnail image URL.
If that looks so foreign to you, use our web tool. Follow the steps below.
- Go to codegena youtube embed code generator
- Enter the primary video URL in the first field and fill in the player dimensions.
- Scroll down to “Create youtube playlist” option. In this field enter the video ID’s each separated by a comma.
- Finally hit the generate button and copy the code.