Help with Course Variables in HTML document

Hi everyone!

I am attempting to create a custom certificate for participants to print out after completing a course by modifying the report.html file. However, I want this certificate to populate the participant's name from an input field within the course with the variable "Name."

How would I go about pulling this "Name" variable and displaying it in the HTML code?

Thank you!

6 Replies
melissa flores

Non-coder desperately seeking help...  Don't know WHERE/WHAT code to type into HTML file to pull variables from storyline.  First, big thanks to all for posted solutions that have gotten me this far! 

I have a 3-page form users need to "sign" electronically (name, job title, date) and print with variables embedded in the html output, and post results to LMS.  I did this once using a quiz by pasting an image of the form in the background of the results slide with variables positioned accordingly and using some basic "print" javascript I found.

BUT... this one's 3-pages, a simple 1-page certificate and print command won't work.  My original form was in Word, so I saved it as BlankForm.html.  I saved two additional copies of BlankForm.html:

     SignedForm.html - this is identical to BlankForm.html but has placeholders in the document's signature line for my variables:  +LearnerName+, +LearnerJob+ and +LearnerDate+ 

     Print.html - this is identical to SignedForm.html (with the placeholders) but has added code to print on load:  onload="window.print();"

My Build:
I built a 3-question quiz to capture name, job title and date (TextEntryName, TextEntryJob, and TextEntryDate) and created variables (varName, varJob and varDate) and triggers to receive the answers.  The first slide has a web object on the top 80% of the slide to display BlankForm.html, which works great bcuz user can scroll up and down to read the form, and clarity is super clean.  The lower 20% has input fields for name, job title and date.

When users answer the last question and press submit, results get pushed to LMS and the Results slide opens .  Here I have web object - SignedForm.html - I want the form to have the variables embedded in the signature line.  (I don't know WHERE/HOW to add the variables code to the SignedForm.html file.)

But MAINLY I need users to be able to print the "signed" form with the variables embedded in the signature line.  I have a PRINT button on Results slide that jumps to a slide called - PrintExit.  

PrintExit slide (looks identical to the Results slide) but this web object - Print.html - has the added code to print on load.  Works great so far - user clicks PRINT button on Results slide, and Print.html pops right up to print.  (Again...  WHERE/HOW do I add the variables code in the Print.html file?)

Per other posts, I came up with the following but don't know where to add it in the html file and how to correctly code my placeholders:
<script>
var player=top.window.opener.GetPlayer();
var LearnerName=player.GetVar("varName");
var LearnerJob=player.GetVar("varJob");
var LearnerDate=player.GetVar("varDate");
document.write("<P><H2>Variable Name: " + LearnerName + "Variable Job: " + LearnerJob + "Variable Date: " + LearnerDate +"</P");
</script>


I'm exhausted and crawling to the finish line.  Can anyone PLEASE assist?  I added a 'redacted' copy of my Print.html file for your to view.

Many thanks!

Andy Sumpner

Hi.

Based on the number of queries about printing off a custom-made certificate at the end of a presentation, it is a very important issue for many of us programmers, especially when the e-learn is not hosted by a Learning Management system and therefore will not automatically update a learners training record.

At present, my presentations direct a learner to a certificate page I have constructed but then I have to direct them to take a screenshot, paste into a Word document (landscape), Crop, centre and print. Very user un-friendly! 

Is it not therefore possible for Storyline to have added to it a user friendly 'Certificate Design & Print' module which is accessible after course completion.

The programmer could design the certificate based on a template slide. The learner would enter their name (and place of work/job title if selected) and the template would automatically add the course title and date of course completion and have a 'Print' tab. I think this would be a great extra and a rather unique selling point for Storyline 360. It would be of great help to many Storyline programmers (without having to become experts in HTML or other coding). 

Matthew Bibby

I agree that this should be something that is included in Storyline Andy. I've long considered it erroneous that certificates are solely the responsibility of the LMS.

I've been building certificates and dynamic workbooks for clients using PDFmake and jsPDF for years. It works beautifully when set upright, however, it can be overwhelming to get started for those who are not comfortable with JavaScript.

I'm working on some software that will make it easy for you to generate PDFs from your Storyline courses (and much more). I'll let you know when it's ready for testing.

If you need help with creating PDFs in the meantime, you can contact me here.