How Do I Create an HTML5 Player Theme in the Back Office?

Video Player - HTML5 All Device
You are here:
< Back

HTML5 is the preferred video player in the broadcasting world since it is compatible with most viewing devices. You can customize your Dacast HTML5 video player with preset features in addition to player API.

Let’s dive into how to create an HTML5 player theme.

What is a Player Theme?

Dacast’s HTML5 video player is a white-label player. This means there is no Dacast branding on it, and you have the capability to tailor it to your own preferences.

In addition to the above, our player theme allows you to brand the player with the choice of your own colors and watermark.

You can create as many player themes as you want and use different themes for different videos. There is also the choice of customization, creating your own custom player theme to be set up as a default for all your video content hosted in your Dacast account.

What Can You Do with the Player Theme?

With the player theme, you have several options, including:

How Do I Create My Own Player Theme?

1. Access “Theming” under “Settings.”

HTML5 Video Player - Themes

2. Then, click on the “New Theme” button.

HTML5 Video Player - New Theme

The following window will pop-up:

HTML5 Video Player - New Theme setup

You can now manage all the following settings:

1. Theme Name (including making it as your Default Player theme)

2. Controls

  • Enabling Player Controls (The controls at the bottom of the player)
  • Enabling the Big Play Button (The big button in the middle before playback starts)
  • Enabling the scrubbing thumbnail (These are the thumbnails when hovering over the video scrubber or the time bar on the player)

3. Actions

  • Enabling the Download Button (Whether your viewers can download or not your video content)
  • Enabling Social Sharing Button (Whether your viewers can see links to share content on social media)
  • Enabling the Embed Code (Whether your viewers can see and copy/paste the embed code  for their own content or sharing)

4. Appearance

  • Changing the Overlay Color (This is the primary colors of the player itself)
  • Changing the Menu Color (The secondary color of the player)

5. Behavior

  • Enabling Autoplay (Whether the content starts automatically or not)
  • Start Video Muted (Whether the is muted by default or not)
  • Looping (Whether the content plays and start again once it reaches the end)

6. Live Streams

  • View Counter (Option for viewers to see how many people are currently watching your live stream content)

7. Playlists

  • Thumbnail Position (This is the position of the other links, that is displayed in the playlist content)
  • Continuous Play (Whether the next content will start automatically when the current one ends)
  • Skip Videos (This displays thumbnails of the video content, so viewers may have the option to skip)

Please Note: Clicking on the “Advanced” option at the top right part, will give you the option to do the following:

HTML5 Video Player - New Theme advanced setup

1. Offline Message

  • Changing the offline message (the text that viewers will see if the content is offline)
  • Changing the positioning of the message (Top, Middle, Bottom)

2. Delivery Method

  • Compatible Delivery (Whether the content will start again when it reaches the end)
  • Secure Delivery (An attempt to play the content under any if not all circumstances, for compatibility reasons)

3. Region Settings

  • Standard PoPs (Standard delivery method in China, may be slow though)
  • Premium PoPs (This is with increased performance, most specifically in China)

For this option, we have included a “Contact Us” button, as this delves into our delivery methods in China, most specifically. Our Sales and Marketing team can get in touch with you, to learn more about this option.

Finally, after all revisions and editing are done, based on your preferences, always please scroll down and click the “Create” button to save all changes.

HTML5 Video Player - New Theme setup create

Additional Resources

Leave a Reply

Your email address will not be published. Required fields are marked *