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!

247 Replies
OWEN HOLT

You could use Jackson's trick to import the files into your StoryLine published content using a hidden web object slide.

Once published, you will use JavaScript to play the music and control the volume. His post includes the script and instructions.

See the instructions here: LINK

Todd Haynes

I tried the JS solution, but found it too cumbersome and worried about support for SCORM and our LMS. So, my solutions so far are to 1) use Storyline 360 and build everything in 1 slide with an imported audio file and then develop all the content in a TON of layers, or 2) use different product like Captivate or Camtasia.  

Matthew Bibby

Hi Suzanne,

The background audio plays when you are viewing the Flash output. So, make sure you have Flash enabled, and view the Flash output that Emily shared in her original post.

However, if you view the HTML5 output, it won't work. As shown here.

You can fix this by making the same code modifications to your story_html5.html file as you did to the story.html file. See here for details.

Or... even better... you could use this approach. It'll give you a bit more control over things. Owen has shared a sample file here

Matthew Bibby

Yes, definitely possible, but you'll need to use a different approach. 

Have a look at the work Jackson has done here. I don't remember if he shows how to stop the audio after a set period of time, but It should be relatively easy to modify it to stop after 6 minutes.

I'm flat out today so won't have a chance to put a sample together, but hopefully, someone can help you with this. 

Brande Morrison

I know this is an old thread, but wondering if this works for anyone on SL3? Our LMS uses the index_lms_html5.html file, and that's where I added the code (before the closing <body> and <html> tags). It works if I click on the file from my published files/folders, but not once put out on the LMS.