Can we change background color in Modern Player - Storyline 360

It's been over a year since the initial request for the ability to customize colors for the modern player. Any plans to adding that feature to Storyline 360? It exists for the Classic player but not for the Modern player. Hard to match corporate colors to "Dark" and "Light". 

Thanks for checking in, Emerson! 

The ability to customize colors for the Modern Player isn't on our immediate feature roadmap, but we're keeping track of every request we receive. Thanks for letting us know this feature is important to you!

Great work David!

Have you managed to locate the navigation width value? I'd love to be able to gain a bit more real estate back from the left menu panel.

Thanks for your efforts!

Hi td,

I did a quick experiment and it seems you can. It depends on what you want to change. The following code will change the player border to red at the top graduating to yellow at the bottom:

$(".top-ui-bg").css("background-image", "linear-gradient(red, red");
$(".area-primary").css("background-image", "linear-gradient(red, yellow")

The top line defines the gradient for the top bar to just red, hence both colours are red. The second line changes the sides and bottom bar from red gradually to yellow. You can use Hex colours if you want.

The Linear-Gradient tag seems fairly flexible, you can set direction, more colour stops etc.  See this page for more information on syntax:

https://www.w3schools.com/css/css3_gradients.asp

Hope this helps a little

Thanks David. This is brilliant. I was able to change the colours to a gradient .

You're welcome. You can change any of the code in this thread the same way to get a gradient.

I have dated coding experience. Need to relearn the tricks :) Thanks once again David.

Hello everyone,

I think that something has changed with the new update because the javascript tricks are not working anymore in the modern player. 

I did my elearning last week, and everything was all right, I could change the modern background colour, and even put the module in full screen with a few javascript tricks. But now, when I tried to publish it, it doesn't work anymore... 

I even tried publishing the file story of David Crocker, and same thing, doesn't work anymore. So I really think this is due to the recent update.

Hello Marilou and welcome to E-Learning Heroes :)

The latest update did include a new accessible player. In addition, to improve security for our customers, we removed jQuery from Storyline 360. You can still use it to write custom JavaScript. You'll just need to reference the jQuery library directly.

Check out www.cluelabs.com.

Free sign-up and they have a method to change the colors in the Modern Player. I am in no way affiliated with ClueLabs, I just thought this might help you.