Print Custom Certificate using Javascript in Articulate Storyline

Print Custom Certificate using Javascript in Articulate StorylineIn one of the projects, we came across a requirement to capture user responses in the certificate. The tool we used is Articulate Storyline 360 along with JavaScript.

Step 1: Add the questions.

Step 2: Create the certificate design and keep it in a folder.

Step 3: Create variables for assigning the correct values for every question.

Step 4: Now, add the following triggers incorrect layer of every question. These variables will be accessed on the certificate page to show user responses.

Repeat the steps for all the questions.

Step 5: In the result slide, after completing all the questions you need to add the following script on the print certificate button.

Step 6: To get the student name on the certificate, create a variable username or you can pull the username from the LMS.

Step 7: Now add the following script on the result slide.

Till here we have completed Storyline coding. Now, we will work on the certificate page to access the username and the correct answers.

Step 8: Create an HTML file with the following code.

Step 9: Now create the variable in the HTML file and add the following code which will call the Articulate Storyline variables values.

Step 10: The following code will store the value of the correct answer and hide the incorrect responses.

Step 12: Now publish and view the output.

Note: Make sure to create a certificate folder in the story_content Folder after every publish and keep the certificate there.

Preview the sample below: