This article will build out different ways you can customize the player to change certain elements that don't have an integrated way to change them inside of your app options.
Many elements and buttons can be easily customized via Spotlightr app settings. However some edge cases are not covered, and in these cases you may be able to customize elements with custom code.
We'll review examples below.
Auto-Play Un-mute Button
You are able to change the color of the button or size of the button by adding some custom code.
Here is the Un-mute button by default:
You can change the background color of the button to red by adding this code to your Custom Code section:
<style>
.mute-button {
background:red !important;
}
</style>
Which will result in this:
Playlist Background Color
To change the background color to something specific use this code:
<style>
#playlistVideoList {background:white
!important}
</style>
Just change the color as necessary.
We will continue to build onto this topic as customer questions arise.
Font of the Video Title
The font that appears at the top of the video when you turn that option on can be changed:
This can be changed via the watch page customization field. Navigate to your Theme >> Watch Page >> Advanced Options:
Here is the code, just change the font name accordingly:
<style>
#video-name {
font-family: Georgia, serif;
}
</style>