Playlists
if we have multiple videos to show; Instead of displaying multiple players, we can add to playlist items attached to one single player instead.
For example, here we are looping through a Video CPT for the playlist. The player to set to playlist mode. Clicking each playlist item will load the media into the corresponding player. The 'prev/next' buttons are controls inside of the player to move to the next video. The playlist can then be managed in WP via a CPT or repeater field.
Tip - By using Bricks' query loop, we can then take advantage of the filter elements to give the user more control over the list to find what they want to watch.
For example, here we are looping through a Video CPT for the playlist. The player to set to playlist mode. Clicking each playlist item will load the media into the corresponding player. The 'prev/next' buttons are controls inside of the player to move to the next video. The playlist can then be managed in WP via a CPT or repeater field.
Tip - By using Bricks' query loop, we can then take advantage of the filter elements to give the user more control over the list to find what they want to watch.
Video Playlist
Playlists can include a mixture of different video sources. For example, self hosted mp4s, HLS streams (bunny stream / cloudflare stream etc). Each playlist item stores all the data for that media, the source URL, poster image, any chapter data, text tracks for subtitles etc.
The captions are being dynamically fetched from the HLS stream (generated by AI).
The captions are being dynamically fetched from the HLS stream (generated by AI).
Because we're building the overall layout with native Bricks elements, this allows you to build any video + playlist layout (and save as a component that could be used elsewhere with different content).