Background Audio Cool Trick

May 23, 2016

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!

Pinned Reply
Luciana Piazza

Hello, Everyone! ✨

I'm happy to share that we have released a new update for Storyline 360 (Build 3.79.30834.0).

In this update, we have an enhancement where:

As a first stepI recommend updating Storyline 360 to the latest version. Here's how:

Update Authoring Apps

If you have any questions, please let us know in this thread or privately in a support case.

Have a great day! 

281 Replies
OWEN HOLT

I still believe using JavaScript to modify the HTML code at StoryLine launch is a better method than modifying the published output every time you publish.  Save yourselves the headache! Set it, and forget it!
Link to my post in this thread.
Link to additional discussion thread.

I'm more than happy to walk anyone through the JavaScript associated with this alternative method so that you can do more than copy and paste it, you can understand it. :)  Just ping me.

Kathy Robertson

Emily this is brilliant - thank you. It hasn't worked for the particular project I'm working on at the moment as I have different music clips on some slides, and I just wanted to fill in the silences with one background tune, but I then get both tunes playing which I don't want.

I will definitely use this method in the future though.

Ashley Terwilliger-Pollard

Hi Rovie,

Due to some changes in the published output based on Storyline 3 and 360's shift to allow for HTML5 first/only publishing it changed the way this workaround behaved. I haven't seen an example that someone's created for the latest versions of Storyline - but we'll keep you posted if we see it and link back to this discussion. 

OWEN HOLT

As far as I can see, the JavaScript solution still works in SL3. See the attached SL3 .story file and the zip of the published content. The .story file has 2 song choices on slide 1 and 2 on slide 2 as well as a volume control dial (found on the slide master).  Unzip the file and double click the story_html5.html file.

Daniel Bolia

Hi Owen,

Thank you for posting your example and source files. I used your codes to create an SL file with music that spanning multiple scenes. I also used some of Jason Hamner's codes (https://community.articulate.com/discussions/articulate-storyline/background-music-demo?page=3) to auto play a designated music file at the beginning of the scene and stopped at a designated scene. I was also able to go backward in the timeline and the music would auto-restart at the designated scene. 

Your volume control button was also very fancy and works wonderfully. However, my course was designed to show the default player volume control. Is there any way to control the background music using the built-in volume control?

Thank you,

Dan

Andrea Squires

Hi Emily,

Thank you for the wonderful audio trick, it's works like a charm when I'm publishing to web. But I need to publish to an LMS and mine needs the file to be zipped.  I tried publishing as SCORM, adding the code, and then zipping and uploading.  LMS wouldn't accept the file. Any ideas what's happening?  Thank you.

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