Playlists
Você pode exibir vários vídeos em sequência no player. Escolha um dos dois tipos de playlist de acordo com seu caso de uso.
| Tipo | Como informar | Recomendado para |
|---|---|---|
| Dinâmica | IDs dos vídeos na URL (video_ids) | Criar a lista dinamicamente no seu código |
| Estática | ID da playlist no painel (/pl/…) | Uma playlist já criada no catálogo |
Playlist dinâmica
Informe os IDs dos vídeos separados por vírgulas no parâmetro video_ids:
<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>
Os navegadores limitam o tamanho da URL. Use uma playlist estática para listas longas.
Playlist estática
Informe o ID da playlist no painel:
<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>
Para criar e configurar uma playlist no catálogo, consulte Playlists .
Usar uma playlist com a IFrame API
Passe as mesmas URLs no parâmetro url de 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('Vídeo atual:', event.data.item.id)
})
player.on(player.Events.Ended, () => {
console.log('A playlist terminou')
})
})
}
behavior.playlist.autoSwitch inicia o próximo vídeo automaticamente. O valor padrão é true.behavior.playlist.loop repete toda a playlist. O valor padrão é false.
Controlar uma playlist
| Método | Descrição |
|---|---|
next() | Inicia o próximo vídeo |
previous() | Inicia o vídeo anterior |
switchTo(id, options?) | Muda para um vídeo pelo ID |
getPlaylistItem() | Retorna o vídeo atual ({ id }) |
Para ver as assinaturas dos métodos e o evento CurrentTrackChanged, consulte Controlar o player
.
Próximos passos
- CTA — adicione chamadas para ação aos vídeos da playlist
- Criar um player
— configure
CreateOptionsebehavior.playlist - Playlists no catálogo — crie playlists estáticas no painel