Brightcove Player Playlist Endscreen Plugin v1.0.1

Brightcove Player Playlist Endscreen Plugin is now available.

Configure your Player

Requirements

• Brightcove Player v6.51.3 and newer

Using Studio

Configuring your player can be done in Studio by:

• Navigate to the "Plugins" tab
• Click the "Add a Plugin" button
• Select "Brightcove Plugin"
• Select "Playlist Endscreen"

Manual Configuration

In the JSON editor, add an object like this to the "plugins" array:

{
  "name": "playlistEndscreen",
  "options": {},
  "stylesheets": ["https://players.brightcove.net/videojs-playlist-endscreen/1.0.1/videojs-playlist-endscreen.css"],
  "scripts": ["https://players.brightcove.net/videojs-playlist-endscreen/1.0.1/videojs-playlist-endscreen.js"]
}

How it Works

When the Playlist endscreen plugin is added, the player will display a button in the player UI.

When this button is clicked, the player will display a screen with a list of videos. This videos are retrieved from the playlist ID that was configured by making a Playback API request.

When the playback finishes, the player will automatically display the playlist endscreen. So the viewer can access to it via the end of the video or by clicking the button at any time.

Plugin Options

The plugin supports the following options:

options.playlistId

Type: string
Default: ''

This should be used to set the playlist ID of the playlist that you want to be displayed in the player.

options.title

Type: string
Default: Related videos

This is useful to change the endscreen title, for example: More videos. This setting will also change the player button tooltip.

Setting playlist ID

There are aditional ways to configure playlist ID to retrieve the playlist you want. This playlist ID can come from one of the following sources:

• Attribute on in-page embeds: data-endscreen-playlist-id="123"

• Query string for iframes: &endscreenPlaylistId=123

• In runtime with setPlaylistId() method:

  var player = videojs('my-video');

  player.playlistEndscreen();
  player.playlistEndscreen().setPlaylistId("123");