Forum Discussion

BarMazuz's avatar
BarMazuz
Community Member
18 days ago

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-brandwithout 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

    • BarMazuz's avatar
      BarMazuz
      Community 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 slide

      2. 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.