Building Closed Captions in Storyline 2

cc-sample-slideThere are multiple ways to build closed captions for your e-learning projects in Articulate Storyline.  I prefer using variables to build my closed captions, such as Matt, Tom (creating CC and adding CC), and Tracy have done.

I like all of these solutions and have used various parts of each to build closed captions. One item I’d like to address is when you have slides with multiple layers. What happens when you have an audio track on the base layer AND three additional layers each with their own audio tracks? How do you keep the closed captioning in sync with each layer?

In this post, I’ll show you one way to handle that and provide you with a source file to use as a starting point for your own projects. Let’s take a look at all of the parts.


Once you create your slides, you add a CC button (this toggles the captions on/off), and the actual area where you want to display the captions to every slide. I add mine at the very bottom of the slide – a shape with text (CC) and a transparent box with variable reference (%transcript%).



Create two variables. The transcript variable will be used to dynamically change the text in sync with the audio. The transcriptToggle variable will be used to toggle your closed captions on or off.



First, create a toggle trigger for your CC button. This makes your CC button an on/off switch.


Next, create your slide triggers. These triggers show or hide the transcript bar based on whether the transcriptToggle is true (on) or false (off).

cc-transcripttoggle-trigger1 cc-transcripttoggle-trigger2

I add an additional trigger which makes the state of the transcript area (normal or hidden) persist when the learner advances to a different layer or slide. Rather than having to click the CC button to turn it on for every slide, this trigger tells the transcript area to stay on or off based on the value of the transcriptToggle variable.


Next, go through your audio and determine where the text will be broken into parts and add cue points on the timeline.


You can then add triggers to change the text. The trigger is set up so that the value in the transcript variable (your broken up chunks of text) will automatically change when the timeline reaches a new cue point.


I add an additional transcript trigger that sets the value to blank when the timeline starts on a slide and on each layer. Otherwise the last block of caption text will show at the beginning of the next slide/layer. Adding this trigger reduces confusion and looks more polished.



If a slide has audio on the base layer and different audio on additional layers, I add the same transcript triggers (breaking the text into chunks and adding cue points on each layer timeline).


If I preview the slide as is, the base layer audio and CC work fine, but when I click on another layer, both audio tracks play at the same time and the CC on the base layer overlaps the CC on the other layer. In order to fix this, you need to edit the layer properties for each additional layer. Click the gear icon on the layer to open up the properties window. Set the layer properties as shown below.


(Note: you only need to change Allow Seeking to Yes if you are using Storyline’s built-in seek bar on the player.)

So there you have it – another take on adding closed captions to your Articulate Storyline project. I hope you find it useful. I’d love to hear about different techniques you have used!

As promised, here are links to the source .story file and the published output.

Source File


This Post Has 5 Comments
  1. […] The technique for this effect was first shown to me by Nancy Woinoski at an Articulate Community Roadshow in Toronto a few years ago. I liked the clean effect, and thought it would be a great one to share with the greater commonwealth of e-learning developers! There are many other ways that you can create this sort of effect, and perhaps one day, you will no longer need a workaround for closed captioning in Storyline (pleeeeease, Articulate?!). Until then, we have workarounds. David Lindeberg actually drafted a great post on how he approaches closed captioning in Storyline – you can read it here. […]

  2. Hi David, thank you for the demo of CC – I’m new to CC. One quick question, how to you change the style (appearance) of the cc? It seems to always be white text on a darker (black) background. I have seen white text with a dark pin line around the text characters with a transparent background. Is using that “style” (of no dark background rectangle) of CC a matter of file format or is it a “setting” I can adjust to replicate this style of effect. – Thnx G

    1. Hi Garry,
      Thanks for visiting. First, are you using Storyline 2? If so, you can change the text to whatever color you would like. Ditto for the background color (it’s just a rectangle shape that I changed the transparency on).

      If you are thinking about upgrading to either Articulate 360 or Storyline 3, the cool thing is that Articulate added CC functionality that makes it a lot easier. No work-arounds like my demo. And if you might be wondering which one to purchase, Tim Slade made a great video that compares the two products.

      Hope that helps!


Leave a Reply

Your email address will not be published. Required fields are marked *