The Blue Billywig video player is completely customisable, with the ability to use your company colours and logos. Configuring the player appearance as well as many other settings can be found in the “Playout” menu.
This article will go over all the settings presented in the Playouts > Appearance menu. To get started:
- Go to the Media Library
- Click “Playouts” in the left sidebar
- Select an existing playout (e.g. the “default” playout) or create a new one.
- Head over to the “Appearance” tab.
1.0 | General
Enter a title for the playout. The title of the playout will not be visible to viewers, but we recommend using a descriptive name. If the amount of playouts increases overtime, they will be easier to manage.
1.1 | Dimensions
Set the width and height of the player to:
- be fully responsive;
- have size absolute size (in pixels); or
- cover a percentage of its container.
Responsive player sizing
To display your video content, a player needs to be embedded on your website or in your app (read more about embedding your content). Enable “Responsive player sizing” to make sure the player covers the width of its container (in one of the upcoming settings it’s possible to only cover a percentage of the container).
Enabling the ‘Responsive player sizing’ setting is recommended for responsive websites.
Disabling the ‘Responsive player sizing’ offers the option to set a fixed width and height.
Use aspect ratio of video
The aspect ratio ratio of a player refers to the width in relation to its height. By default a player is set to take apply the aspect ratio of the video content that is displayed. As a result, the player will look at the width (either responsive to the container it’s placed in or an absolute size) and determine then determine the height based on the specific video content.
Fixed aspect ratio
Use the dropdown menu to set your player to fixed aspect ratio: 21:9, 16:9, 4:3, 3:2, 1:1, 4:5 and 9:16. The player will not alter its height based on the video content.
When setting a fixed aspect ratio for the player, it’s likely that video’s aspect ratio is not exactly the same. The player decides to show empty space around the content and/or cut off part of the content. This is done based on the Fitmode settings (learn more about Fitmode to display content with a different aspect ratio)
The width of the playout is set to cover 100% of the element it is placed in, but can also be set to a different percentage or a fixed width (in pixels).
Set a maximum width in pixels.
1.2 | Color
The color of the player and its skin can be configured to match your brand and website.
- Background opacity
By default set to 100% (not transparent). When set to 0%, the background color will not be visible.
- Highlight color
Controls the accent color of widgets such as the progress bar and the icons in the progress bar.
- Background color
Controls the color of the control bar background, popup windows and the title display background. The opacity of this background can be adjusted with the Background opacity slider.
- Playout background color
Controls the background color of the player. We advise to choose a transparent background (by clicking the ‘x’) or to match this color to your website background in order to have minimum visible disruptions when a video is loading.
1.3 | Logo
Your logo can be displayed in any of the corners of the video player. Either choose a previously uploaded logo by clicking ‘select’ or click ‘upload’ to add a new logo.
Choose the position by clicking the dropdown menu under alignment.
Direct viewers to a webpage when clicked by adding a ‘Click URL’.