Kingsley eLearning Solutions

You have big dreams for your eLearning.
We'll make them come true.

image of Kingsley

Create multi-level TOC in Adobe Captivate

Submitted by Kingsley on Mon, 03/05/2018 - 17:46

Chuck Sigmund asked for some help in the Adobe Captivate Users LinkedIn Group. He needs to create a multi-level menu. 

My solution uses a bit of JavaScript/Jquery trickery and I only built it for the Responsive output.

I add a ">" to the beginning of the slide name of any slide I want to indent (ex: >Level 2 slide"). 
Then I run this JS when the course loads:

$( ".tocText nobr:contains('>')" ).each(function( index ) {
	var str = $( this ).text()
	var res = str.replace(/>/g, "  ");
  	$( this ).html(res)
  	$(this).parent().siblings(".tocBookmark").css("left", 20)

That code will will check all the TOC entries (.tocText) to see if they contain a ">".
Then it replaces the ">" with two spaces ( "  ").
And finally it finds the items bullet point and moves it to the left as well.
It's not perfect... but it's a great starting point.

Leave a comment if you tweak this or if you have any questions.
Contact me if you have an eLearning Puzzle you need to solve.


Submitted by StephenMorris (not verified) on Thu, 08/16/2018 - 11:14


Take your elearning substance to the following level by learning propelled Adobe Captivate strategies that expansion your proficiency and manufacture more strong courses. The most effective method to utilize a portion of the colossal efficient alternate routes in Captivate, make question pools to test your learners.

Add new comment

This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.

Enter the characters shown in the image.