Navigation with custom buttons SL 2

Jun 29, 2017

Hello everyone, 

My client wants to use custom Prev/Next buttons and disable the player navigation. They also want to use individual slides versus slide layers, even for content that would normally be chunked into layers. They want to have these chunked content slides automatically advanced and only use the custom NEXT button when we're moving to new content. I have grey PREV/NEXT buttons on all the screens that have no triggers attached. When the learner reaches the end of a timeline where I want them to manually advance, the buttons turn gold. So far it's easy.

Here's where I'm getting stuck. The client wants the learner to be able to click backwards through the module as much as necessary using the PREV button. But to be consistent, the navigation buttons need to turn gold. For example, slides 1, 2, and 3 advance automatically (grey buttons) and slide 4 is a manual advance so when they reach the end of the timeline the buttons turn gold.  If the learner wants to go back to slide 3, they simply hit the gold PREV button. But, then once they're on slide 3, they need a gold NEXT button to move forward again. But I already have a trigger that states the slide advances automatically.

As I see it, I have 2 issues:

1) I need grey buttons to become gold on automatically advanced slides ONLY IF the learner has already visited the slide and is viewing it a 2nd time. 

2) I need to "turn off" the auto advance when a slide is being visited for the 2nd time. 

I have no idea how to make this happen but I think it has something to do with states and conditions, neither of which I've ever been able to figure out.

Can anyone help? I am using Storyline 2.









52 Replies
Susi B

Hi Lynn,

with the use of variables as described here you can control your trigger actions.

For example:

1. Create a variable for each slide with the type true/false (set to false) that advances automatically.

2. Create a trigger on e.g. slide 4 "change variable "variableslide3" to "true" when timeline starts". So now when the timeline of slide 4 starts the slidevariable of slide 3 is set to true (=seen/visited).

3. Adjust your auto advance trigger "jump to next slide when timeline ends" with the condition (blue + sign) to "slidevariable equals false". So now they should not auto advance when revisited. (Slide 3 is false and it auto advances, after slide 4 timeline starts its changed to true and the auto advance stops.)

4. "Change the state of your buttons to gold when timeline starts" with the condition "slidevariable is true". The buttons have a condition too that they only advance if the slidevariable is true.

I created a little example for you see attached file. :)




Lynn Hauser

Hi Susi,

I've been struggling with this for hours. My biggest stumbling block has been that the buttons on the slides that are manually advanced can only be active once the timeline ends. So it seems like I need two triggers:

First, change state once timeline ends....done with no problem.

Second, jump to next/previous slide when user clicks buttons but only after they've changed state. This is where I'm getting stuck.



Lynn Hauser

Hi Susi (or anyone else out there who might be able to help),

I figured out the problem I mentioned in my last post. But, I can not get the buttons to change color nor advance when I revisit a slide that had previously auto advanced. As far as I can tell, I set up the variables exactly as you have them. I attached a set of 5 slides. Slide 1 is auto advanced with no buttons at all. Slides 2 and 4 are the ones that auto advance and need to have gold, clickable buttons once they are revisited.

What am I doing wrong?



Wendy Farmer

Hey Lynn

variables need a unique name so delete the text ones - recreate as T/F with the same name.

You might get a popup box saying these variables are used in xxx triggers do you want to delete - you can.

Then in your triggers you will see an 'unassigned' tag so you know which ones to slot back in.

All the best and shout out if you have any problems

Lynn Hauser

I did that but the slide still isn't working. This is making me insane but it's just not worth the effort anymore. I only have a few slides where I need this happen so I think I'll just change the navigation to manually advance on all the slides where I'm having trouble which will eliminate the problem. Thanks so much for your help Wendy. 

Lynn Hauser

Wendy, You are so sweet to offer. I've attached. The one that works correctly is slide 2 (Clock Outline). The one that's not working is 1.6 Expectations. This slide automatically jumps to 1.7 at the end of the timeline, but then needs to have gold clickable buttons if the learner goes back to it from slide 1.7. That's the part that not's working. Thanks for any help you can give me. Lynn

Lynn Hauser

The second outline slide (without the clock) should have prev/next buttons that turn gold and are active after the timeline ends. That's the one pair that actually worked for me. 

I just checked it again, and you're right, the prev button doesn't work. That's very odd as it worked earlier. 

This is really messed up; maybe it's not just me not knowing how to use states/conditions. 



Wendy Farmer

Hi Lynn

as discussed on the phone there is always more than one way to achieve something with SL - that's why we love it's versatility.

I have added in three new variables (number variables - slide2_new, slide3_new, slide4_new) - I think this may be easier for you to work with.

Also on slide 1.2 I duplicated the normal state (grey) of the prev and next buttons and created a disabled state and set that as the initial state. 

One thing to note when you have a button and the text is not part of the button be careful how the trigger is set up and how the user clicks on the button to progress. The size of the triangle is small and the text is not part of the trigger so the user needs to get their click on part of the triangle to proceed.  One way is to group the image and text together (i don't find groups play nicely) or you could put a hotspot / transparent shape over the top that the user clicks or you could group the image and text, right click and save as a picture which you then insert back into SL.

This is how it works:

  • First pass through on slide 1.2 - the prev/next are set to disabled (grey)
  • A trigger sets slide2_new to a value of 1 when the timeline starts
  • Triggers are set to change the prev and next buttons to gold only when the timeline starts and the number variable slide2_new > than 1 (each time the user comes back to this slide the timeline starts and the variable increases by 1)
  • On this slide even though you want it to advance automatically on first pass, when the user returns to it and sees the gold active next they will want to click it to go forward to I have also set trigger to jump to next slide when user clicks next if slide2_new > 1

I have only made changes on slides 1.2 and 1.3

Hope this helps -shout out if I missed explaining anything.

Lynn Hauser

Hi Wendy, 

I actually had the buttons grouped but ungrouped them thinking that might be the problem. Thank you so much for you time in helping me fix this. I will look at it in the morning with a fresh eye. If this taught me anything it's that I need to learn more about states, conditions and variables. 

Have a lovely day. Thanks again for your help.




This discussion is closed. You can start a new discussion or contact Articulate Support.