dynamic links using js in a SCORM LMS environment

htrstew Community Member Posts: 7 ♪ Opening Act ♪
Hey Everyone

Below here is an article I found regarding dynamic links in Lectora. Basically it allows all the links in a module(s?) to be located in a separate html/js file that is easily updated. Wondering if this solution would work with one js file with many different modules on a SCORM complient LMS (Clarity)? Then I could update any web address in this file and it would update all the related links in all the modules without re-exporting and reposting any of the modules. This would be SO GREAT. Even if I could get it to work per module with SCORM on an LMS it would be helpful. I am absolutely new to Lectora and js. I have worked in similar programs (Captivate) and I am sure with some determination I will be able to make sense and good use of your suggestions.

Thanks in advance,


The Article

We had a Lectora project that was going to have many (20-30) embedded links pointing to external web sites. The problem was that these URL's were going to be changing soon, with more possible changes in the future. So, we wanted to find a solution that would set all of these links to use variables as the URL's. Then, we wanted to set all of these variables externally in a file, reading them at runtime to set the most current values for the URL's, and thus pointing the links to the current site.

Essentially, we wanted to externalize all of our links to one location so that we could modify them easily without painstakingly finding them one-by-one and modifying them and then having to republish the whole module.

After much research and trial and error, we finally found a solution:

We set up all of our variables ahead of time in Lectora. This was accomplished by clicking the menu 'Tools -> Manage Variables'. Using this manager, we added a variable for each hyperlink URL that we would need in our project. For example, we set up a variable called 'myUrl'.

We next added hyperlinks that pointed to these variables that we set up. So, using the example above, we highlighted some text in a text field, right clicked and chose 'Add Hyperlink', chose 'Web Address' as the target, and typed 'Var(myUrl)' for the Web Address field.

Once all of our links were pointing to the variables that we set up, we created an external .js file to hold all of our variable declarations. So, we created 'myLinks.js' with the following code:





Notice how the word 'Var' precedes each variable name. 'set' is a function that sets the variable specified in Lectora to the value in the parenthesis. So, the first line sets our 'myUrl' variable in Lectora to 'http://www.cnn.com'

Finally, we needed to include our .js file into our Lectora project. However, we wanted to keep it external so that we could modify the link variables, and have our links in Lectora dynamically reflect these changes.

This was accomplished by embedding some Javascript code into an External HTML Object to include the .js file. We clicked the menu 'Add -> Object -> External HTML' to create an HTML Object. Inside of its properties, we chose 'Header Scripting' as the Object Type, and typed the following code in the Custom HTML box:


// -->

<!--<br />

And that was it! We published our project, and every time we had a URL change, we just changed it in the 'myLinks.js' file, saved that file, and it was immediately reflected in the published module. No republishing necessary!

We were pretty excited when we hit upon this solution and just wanted to share it with the rest of the community.

Good luck!


Harry Williams

The Iona Group

The Iona Group: A Communications Agency Producing Motion Graphics and Video Solutions, Websites and Interactive Experiences, Training and Learning Resources for Businesses