Skins and Player Versions

Product(s)
Video Cloud
Brightcove Player
Role(s)
Player Developer
Topic(s)
Styling

In this topic, you will learn about the differences between two Brightcove Player skins, one for Brightcove Player 1.x and the other for Brightcove Player 5.x and 6.x. In this document, since Brightcove Player 5.x and Brightcove Player 6.x use the same skin, they will collectively be referred to as 5+ players.

Overview

The following summarizes the situation in regard to Brightcove Player skins:

  • Brightcove Player 5+ instances will, of course, use the new skin, named luna.
  • Players that existed before the global update to version 5.x were left on the 1.x skin, named graphite.

Determine current skin

An easy way to determine if your player has the old (graphite) or new (luna) skin is to check the initial play button, often referred to by its CSS name, vjs-big-play-button.

  • The first screenshot below shows the 1.x skin with a rectangular big play button located near the top left of the player.
  • The second screenshot shows the 5+ skin with a circular big play button centered in the player. Also note that the title of the video is automatically displayed in the 5+ skin.
1x skin
5x skin

A centered, circular button is not a guarantee of the 5+ skin as it is possible to use CSS to customize the 1.x button, but it is a likely indicator.

Documents exist for changing the appearance and styling of both the 1.x and 5+ skins. This table summarizes available documents.

5+ Skin Documentation 1.x Skin Documentation
Customize Player Appearance Customize Player Appearance
Quick Start to Player Customization Quick Start to Player Customization
  Horizontal Volume Control

Other documents on appearance and styling are not skin specific.