support Contact Support | system status System Status
Page Contents

    Styling Players

    This topic provides an overview of the player styling settings that can be configured.

    Some basic player styling options can be configured using the administration menu. To configure the player Styling settings, in the navigation header, click the administration icon () and then Player Styling.

    style menu

    The following style settings can be configured:

    After any changes have been made, make sure to click Save for the changes to be visible. To discard any styling changes you make and go back to the initial player styling, click Reset to Default.

    Title and description

    Select Show title and description to display the video title and description on the player.

    video title

    Play button shape

    The Play Button Shape setting controls the shape of the play button. The following shapes are supported:

    • Circle
    • Square
    • Rectangle

    Play button position

    The Play Button Position setting controls the location of the play button within the player. The following positions are supported:

    • Center
    • Top Left
    • Top Right

    Color theme

    The Color Theme settings control the colors used in the player including the play/pause buttons, elapsed time and volume, captions, full screen and sharing icons.

    The following theme colors can be configured:

    • Play Button - Controls the color of the big play button, progress bar and volume level
    • Control Bar - Controls the background color of the player controls
    • Icons - Controls the color of the arrow in the play button and the icons in the player control bar

    To change a theme color:

    1. Click a theme color to open the color picker.
    2. Click a color on the ride side of the control.
    3. Click in the square to select a shade of the desired color. Color can also be set by entering the hue, saturation and value (HSV) numbers into the text control.
      icon color
    4. The slider below the color square can be used to set the opacity of the controls.
    5. Click outside of the color picker to modify another theme color.

    Logo Overlay

    A logo overlay is an image that appears on top of the player. A sample logo overlay appears below.

    To add a logo overlay:

    1. Set the Logo Overlay to On.
    2. Click Browse and select an overlay image (.png, .jpg, and .gif images are supported).
    3. (Optional) Enter a Logo URL. When the overlay is clicked, this URL will open in a new browser tab.
    4. Select a Logo Position for the overlay:
      • Bottom Right
      • Bottom Left
      • Top Right

    Page last updated on 15 Jul 2020