Forum Discussion
Building Multiple Language Versions in One Course?
So, it turns out that there is a way to use Javascript to have the Back, Next, and Submit buttons in the player change their text labels on a screen-by-screen basis. This allows those button to be localized in a multi-language, single SCO course. It's pretty easy to do, though as I understand it it may only work in HTML5, not Flash.
On whatever slide/screen you want to change the player's button labels:
- Create a trigger to "Execute Javascript"
- Use the desired Javascript (see the 3 scripts below) and replace INSERT HERE with the text you want to display on the button.
- Set the trigger to fire when "Timeline starts"
- Repeat this process on whatever screens you want to change the player's button text on. Copying and pasting the triggers saves a lot of time.
- AFTER you publish the project there is one more thing you need to do to ensure that the course opens in HTML5. Open the published course folder.
- Right click "imsmanifest.xml" and "Open with" Notepad or a similar program. Do not use Word.
- Find href="index_lms.html" and change it to href="index_lms_html5.html"
- Save the change. (File > Save)
Javascript for changing the Previous button's label:
di_y=document.getElementsByClassName("label prev"); // Find the elements
for(var i = 0; i < di_y.length; i++){
di_y[i].innerText="INSERT HERE"; // Change the content
}
Javascript for changing the Next button's label:
di_x=document.getElementsByClassName("label next"); // Find the elements
for(var i = 0; i < di_x.length; i++){
di_x[i].innerText="INSERT HERE"; // Change the content
}
Javascript for changing the Submit button's label:
di_z=document.getElementsByClassName("label submit"); // Find the elements
for(var i = 0; i < di_z.length; i++){
di_z[i].innerText="INSERT HERE"; // Change the content
}
I've attached an image of what the Javascript looks like for a screen where the Next and Back button labels have been changed to "SIG" and "ANT" respectively.
Jennifer, thanks for this simple javascript method -- we are doing a 3-language course in Storyline 360, Classic Player, HTML5, but I can't get this method to work. Are you still using it?
Ideally we'd like to use the same method to change the course title, and most ideally of all would be to just do it once, when the user selects their language, than doing it at the start of every page.
I know I can instead use one of the other methods proposed in this thread, but this way would be the most efficient...