Playlists
You can show several videos in sequence in the player. Choose one of two playlist types based on your use case.
| Type | How to specify it | Best for |
|---|---|---|
| Dynamic | Video IDs in the URL (video_ids) | Building the list dynamically in your code |
| Static | Playlist ID from the dashboard (/pl/…) | A playlist already created in the catalog |
Dynamic playlist
List video IDs separated by commas in the video_ids parameter:
<iframe
src="https://kinescope.io/playlist?video_ids=ID1,ID2,ID3"
allow="autoplay; fullscreen; picture-in-picture; encrypted-media; gyroscope; accelerometer; clipboard-write; screen-wake-lock;"
style="border: none;"
></iframe>
Browsers limit URL length. Use a static playlist for long lists.
Static playlist
Specify the playlist ID from the dashboard:
<iframe
src="https://kinescope.io/pl/PLAYLIST_ID"
allow="autoplay; fullscreen; picture-in-picture; encrypted-media; gyroscope; accelerometer; clipboard-write; screen-wake-lock;"
style="border: none;"
></iframe>
To create and configure a playlist in the catalog, see Playlists .
Use a playlist with the IFrame API
Pass the same URLs in the url parameter of create()
:
function onKinescopeIframeAPIReady(playerFactory) {
playerFactory
.create('player', {
url: 'https://kinescope.io/playlist?video_ids=ID1,ID2,ID3',
behavior: {
playlist: {
autoSwitch: true,
loop: false,
},
},
})
.then((player) => {
player.on(player.Events.CurrentTrackChanged, (event) => {
console.log('Current video:', event.data.item.id)
})
player.on(player.Events.Ended, () => {
console.log('Playlist ended')
})
})
}
behavior.playlist.autoSwitch automatically starts the next video. The default value is true.behavior.playlist.loop repeats the entire playlist. The default value is false.
Control a playlist
| Method | Description |
|---|---|
next() | Starts the next video |
previous() | Starts the previous video |
switchTo(id, options?) | Switches to a video by ID |
getPlaylistItem() | Returns the current video ({ id }) |
For method signatures and the CurrentTrackChanged event, see Control the player
.
Next steps
- CTA — add calls to action to playlist videos
- Create a player
— configure
CreateOptionsandbehavior.playlist - Playlists in the catalog — create static playlists in the dashboard