Forum Discussion
Tricks with JavaScript & On-Brand Storyline Design
Hey everyone! 👋
I’ve been experimenting with ways to make the built-in Storyline 360 player look and feel less default and more on-brand — without rebuilding the player from scratch.
Using just a few lines of JavaScript on the Slide Master, You can:
🎨 Change the sidebar and bottom bar color
📝 Style the menu text
🍔 Remove the hamburger icon
➡️ Rename the “Next” button
✨ Add a custom border for visual flair
These tweaks helped me align the course with my client’s brand while still using the native player features.
📺 If you're curious, I shared a walkthrough and examples on my new YouTube channel:
🔗 [https://youtu.be/kIwjijlsApY?si=9cHpHHlVNYVnhz5x]
I’d love your feedback or to hear how others are customizing the player too!
#Storyline360 #JavaScript #CustomPlayer #eLearningDesign #OnBrand
2 Replies
- TeddyParvanova-Community Member
Your YouTube video is 22 seconds long so it doesn't show the process.
- BarMazuzCommunity Member
Thanks for replying. Good point.
I do have on my YouTube channel some videos that review the process more, but overall I think the process is basically 2 simple steps:
1. Open the JS trigger in the slide2. Copy the JS scripts I offered on my YouTube comments
It seems to me that if you are a little bit familiar already with these triggers, you will probably get by.Also, you can always stop the video to take a deeper look.
Generally nowadays the idea is to make shorts, not to load the learner with details that he might already know.
If you still do not have the answers after viewing other videos on my channel https://www.youtube.com/@BarMazuz-TechnologyInstruction anf you have a specific question, I can try and answer it here or on my YouTube channel. I'd be happy to help.