Background Audio Cool Trick

Hi All,

Just wanted to share a way to add audio across all slides in Storyline 2 There are a few posts on here about this, and I found this method to be super simple.

**Please note that this is just a cool trick, and not a built in feature of Storyline 2.

Publish your course, open the story.html file with Notepad, scroll to the bottom and add this code

<audio src="YOURAUDIOHERE.mp3" preload="auto" autoplay loop></audio>  with a space before the </body> and place your audio file into the published output folder and there you go. That is it.

Here is an example, http://bit.ly/1sy5dkV  and the output folder is attached.

Have fun!

207 Replies
Emily Ruby

Hey Wendy,

I am not sure of a way to have this loop only on selected slides. This method will loop it through the entire course. I am only just beginning to dive into learning these kind of tricks, so hopefully someone else in the community may know of a way to do this.

If I do stumble across a way to achieve this, i will share an update here.

SCOTT SARE

Create a Slide Trigger and Execute JS in the slide you want to activate the audio in Storyline.  In the slide trigger you can set when the audio file will start, i.e. by user interaction, timeline, cue, etc.  The audio will play from that moment fwd regardless the number or types of slides placed afterwards.  There may / not be a way to adjust looping or volume control, but I have not looked into it yet.  I just tested this and it worked much in the same way as the html audio scr trick mentioned above except you can set when its to begin.  You must Publish the module to test this feature - it does not work in Preview.

Add Script:
var audio = new Audio('audio_file.mp3');
audio.play();

Add *.mp3 File:
Place the audio file in the same location as the story.html file.

Pros: You can control when and how the audio will begin playing in Storyline.

Cons: As is, the volume control switch in Storyline will not control the volume of the audio file (Shazbat!) so it will either need to be adjusted using an unrelated program prior to publish or with additional script - if it exists.

Enjoy and good luck.  Ja.

Milene Below

I noticed the music doesn't play when opened on a mobile phone.  Do you know if I should just add the music mp3 file into the mobile folder within the published file?  Or do I need to add the code you have above somewhere else?  Do I follow the HTML5 instructions listed above for the mobile part to work? 

Milene Below

I'm back.....again!  From previous discussions,  I realize the background music does not play on an iPad or other device with iOS.  I understand that and will live with it.  Here's my other dilemma.  The background audio trick works for me in the local drive, but when I transfer the published folder to a web server, I noticed the background audio doesn't play when I click the story.html link.  Any thoughts?