If you inject a YouTube Playlist in your site, our script will automatically replace it with our playlist module.
You can customise the look and feel of the playlists with some simple CSS code. Our script will use the default style for the YouTube playlists.
If you want to inject a custom playlist with your own videos from various sources (YouTube, HTML5, Dailymotion, etc..) you can use our Javascript API.
To inject your playlist, you need to create a div with a unique id. Then you will have to add the API Call to generate your playlist. Example code:
reEmbed.api('setupPlaylist', 'my_playlist_container_id', {
list: [
{
file: '//www.youtube.com/watch?v=dQw4w9WgXcQ',
image: '//img.youtube.com/vi/dQw4w9WgXcQ/0.jpg',
title: 'reEmbed test video',
description: 'This is the text that will appear below the title of the video'
},
{
file: '//www.dailymotion.com/embed/video/x6b3kz',
image: '//s1.dmcdn.net/tAU9.jpg',
title: 'This is the second playlist video',
description: 'This is just another video description'
}
],
width: 600,
height: 300
} );
The above code will load the playlist module with the default styles. If you want to use your own styles, you have to include the defaultSkin parameter. This parameter can be set to true (which is also the default value) or false. If set to true, the playlist will have no colors and you will have to manually style the elements.
By default, the list of the videos appears on the right side of the video. There is also the option for the list of the videos to be hidden and be visible only if the user clicks on the Playlist button on the toolbar which is placed at the top of the video. To change the appearance of the playlist, use the inlineList parameter. By default, it is set to false. Set it to true if you want to change the appearance of the list. The inlineList is set to true automatically for the YouTube Playlist Embeds (see the screenshots above).
If you set the inlineList parameter to false, then you have to include the listbar parameter containing the size value which specifies the width of the list.
reEmbed.api('setupPlaylist', 'my_playlist_container_id', {
.....
height: 300,
defaultSkin: 1,
inlineList: 0,
listbar: {
size: 310
}
} );
Another optional parameter is the autoplay. By default it is set to false. Set it to true if you want the first video to start automatically.
You can also define which will be the first video. The third parameter is optional in the setupPlaylist function and defines which video will be loaded as the initial video. It is an integer, the index of the first video (using 0-indexing). For example if we want to set the second video as the initial video in our playlist we have to do:
reEmbed.api('setupPlaylist', 'my_playlist_container_id', {
.....
height: 300,
defaultSkin: 1,
inlineList: 0,
listbar: {
size: 310
}
}, 1 );
Καλησπέρα σας, προσπαθώ βάλω αυτή την playlist αλλά κολλάει στο Loading Player. Μπορείτε να το κοιτάξετε; Ευχαριστώ προκαταβολικά.
https://www.youtube.com/watch?v=QYp-ogeil3s&list=PLQU_pSPH2VXQqFGR5LmWVidZgZ15AkZ4E
Hello Ioannis,
for a YouTube playlist, just embed it in your page, and our script will handle it. You don't need to use the above code. Just include this iFrame tag
<iframe width="560" height="315" src="https://www.youtube.com/embed/QYp-ogeil3s?list=PLQU_pSPH2VXQqFGR5LmWVidZgZ15AkZ4E&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
Το έκανα αλλά εξακολουθεί να υπάρχει το πρόβλημα με όλους τους browsers μόνο στα playlist. Με τα single videos δεν έχω πρόβλημα.
http://postimg.org/image/6kwkoho4j/
Hi Ioannis,
you are correct, there is a slightly issue.
The reason is that one of the videos in the playlist has been deleted, and we are not handling it correctly. Working on a fix and will keep you posted.
Thanks for reporting this!
Thank you :)
Hi Ioannis,
we've just released a fix for this.
Please let us know if it works ok
Τώρα είναι οκ αλλά υπάρχει άλλο πρόβλημα. Το playlist έχει 167 videos αλλά με το reembed δείχνει μόνο 47.
Hi Ioannis,
the YouTube API returns a maximum of 50 videos for playlists.
At the moment we call it once, and then remove the videos that no longer exist.
We are working on a solution to make subsequent calls and get the rest of the the playlist.
Thanks for pointing it out.
Great, now i see more than 50 videos. :) Thank you so much guys
Hi, Is there a more in depth tutorial or a link to a working version with a playlist reEmbedded?
καλημερα μπορω να κανω αλλαγη λογοτυπου;;