Skip to main content

Customising your Player

The Viostream Player contains several features that can be toggled on, as well as the ability to apply custom branding and styles. Open an existing Player profile or create a new one to access the Player Editor.

The Player Editor​

The Player Editor allows you to customise the appearance and features of your Player, and provides a preview for both desktop and mobile devices.

Branding & Styles​

Align your Player with your brand identity by customising the following settings:

Custom Player Colours​

By default, the Viostream Player uses a minimalistic black and white colour scheme. You can apply your own colour scheme by changing the control bar, the icons, and the colour the icons change to when hovered over.

tip

Ensure that you choose colours that have an adequate contrast so that your viewers can easily see the player controls. You can use an online tool such as WebAIM's Contrast Checker to check the contrast of your chosen colours against the WCAG guidelines.

Audio Player Branding​

Custom player colours also apply to the audio player. When you embed MP3 files using a custom player profile, your brand colours will be reflected on the audio player control bar and header.

Use the video/audio/mobile preview toggle in the Player Editor to see how your branding looks on each player format before publishing.

Display your organisation's logo inside the Player. When enabled, you can:

  • Upload a logo image (PNG or SVG recommended)
  • Set the size — Small, Medium, or Large
  • Set the position — choose from the four corners of the Player

Features​

Apply tweaks to the behaviour of your Player by toggling the following features. All features are turned off by default.

Show Title​

When your video is paused, the title will be displayed in the top left corner of the player.

Show Playback Speed Selector​

Allow your viewers to select a playback speed when watching your videos - options include 0.5x, 1x, 1.5x, and 2x.

Show Playback Quality Selector​

Allow viewers to select from different qualities of video resolution.

tip

The Viostream player by default selects the most appropriate resolution for the viewer's network speed and device, and will adapt to changes in network speed to ensure smooth playback.

Allow Transcript Downloads​

If you have added a transcript to your video, it can be downloaded via a button in the player.

Allow Social Sharing​

Display a social sharing menu in the player that contains share links for Facebook, LinkedIn and X.

Chapter Display​

Choose how chapters are presented to viewers. Three modes are available:

Progress Bar (default)​

Chapter markers are displayed inline within the progress bar. Viewers can see at a glance where each chapter begins and seek directly to it.

Chapter titles appear in a dropdown menu below the Player. Viewers select a chapter by name.

Horizontal Tabs​

Each chapter is displayed as a compact tab below the Player.

Chapter controls only appear to viewers when chapters have been added to the video. See Chapters for how to add them.