Media Playlist

This nestable element is designed for use with the Media Player element, to build your own custom playlists that can be loaded into a player. Ideal for situations where you want to give the reader easy access/ability to watch a number of different videos (or audio), but don’t want to clutter up with page with multiple players.

[documentation still being written – element in development]

Feature Highlights

• Supports being used with facet plugins to create searchable/filterable playlists.
• Nestable element, no limitation on layout/design.
• Supports including multiple providers in the same playlist. (will switch between Vimeo / Youtube / locally hosted videos seemlessly)
• Auto-find player. No need to set it up, will communicate with the nearest media player within the same section.
• Player will inherit the poster image as set in the playlist.
• Accessible as buttons, or links, depending on how you set it up.
• Active class included for adding custom styling when a particular item is currently being played.

How it works

For maximum flexibility, instead of the entire playlist being fixed inside one element, each element is actually a control that communicates with the nearest media player and will play the media and any attached data (poster image, title, chapters, subtitles) when selected.

You can then simply use a query loop to build an entire playlist based on dynamic data by looping the items, and then customise the layout freely (no different to building a list of posts). As the user browsers the playlist it will update the player to match the currently selected item.

Adding a playlist to a Player

Usually with the media player, you’d add the video URL or audio URL, and set things up inside the player. If using a playlist, you just set the media player to either ‘audio’ or ‘video’ and then set to ‘playlist mode’. You then add the URLs and any extra media data instead to your playlist items, rather than to the player.

When the page loads, the player will load up the content from the first item in the list and then change as the user selects new items. You’d still set up the behaviours and any styling inside the player, but all the data would stored inside the playlist. The playlist controls the player.

If there’s a particular use case you have, or any functioniality that you’d like to see built here, send in feature requests with your idea.