Click or tap on the play button to watch the video.
In corporate training, it’s important to create learning experiences that are not only interactive but also personalized. One useful feature is letting learners download their responses or notes as a PDF. This is great for things like reflections, surveys, or training summaries.
Articulate Storyline 360 is a powerful tool that lets you build eLearning content and even use JavaScript to do more advanced things—like making a PDF from what a learner types in.
Welcome to our step-by-step JavaScript guide, where we will guide you through the process of creating a PDF that contains text entry data and downloading it in Articulate Storyline 360.
What is Articulate Storyline 360?
Articulate Storyline 360 is a tool that helps people build interactive eLearning courses. It is part of the Articulate 360 suite, which includes tools for creating presentations, videos, quizzes, and more.
Key features of Storyline 360:
✔ Easy to use with drag-and-drop design
✔ Works with variables and triggers to make courses interactive
✔ Supports JavaScript for advanced custom actions
Many elearning companies use it to build training programs for employees and that is where we come in. We help businesses design and deliver custom eLearning using Articulate Storyline 360.
Partner with Swift eLearning Services to unlock the full potential of Articulate Storyline 360 with custom development, localization, and scalable eLearning delivery.
Why Generate PDFs from Text Entry Data?
In corporate training scenarios, instructors or managers often want to capture written feedback, answers to open-ended questions, or form data from learners and have it available for review or record-keeping. Storyline 360 doesn’t do this on its own, but with JavaScript, you can add this feature.
Step-by-Step JavaScript Guide to PDF Creation
Step 1: Prepare Your Code File
You can open a blank page in Notepad++ or Brackets to write the code. If you prefer, you can download the supporting files from the link below.
To download the supporting file for PDF creation, simply click the Download button below.
Step 2: Customize Your PDF Content
You can customize the text for the PDF name, page title, and questions text. Once you’ve finished, save the page as certificate.html.
Step 3: Insert a Web Object in Storyline
Open the Articulate Storyline 360 source file, go to the slide where you want to insert the web object, click on the Insert tab, and then click on Web Object.
Step 4: Link Your HTML File
Within the Web Object Properties dialog box, insert the URL of the folder containing the “certificate.html” page into the Address field. Afterward, click the OK button.
Step 5: Add JavaScript to the Download/Print Button
Add this script to your Download/Print button trigger in Storyline to run the PDF generation inside the web object iframe.
// Name of the certificate html file
var certFilename = ‘certificate.html’;
// HTMLCollection of elements of type iFrame
var iframeElements = document.getElementsByTagName(“iframe”);
// Iterate over the iFrameElements HTMLCollection
for(var i = 0; i < iframeElements.length; i++){
/* If src of current iFrame element equals the filename set in variable
** certFilename call the generatePDF() function.
*/
var src = iframeElements[i].getAttribute(‘src’);
if (src.indexOf(certFilename) !=-1) {
iframeElements[i].contentWindow.generatePDF();
}
}
Step 6: Publish Your Course
Publish the file and launch the course.
Step 7: Test Your PDF Download
Launch the course by opening the story.html file. You can then enter data into the text entry fields. Once you have completed the course, you will have the option to download a PDF containing the data you entered.
How Our eLearning Solutions Can Help You
As a trusted eLearning solution provider, Swift eLearning Services specialize in custom corporate eLearning development that harnesses powerful tools like Articulate Storyline 360 to deliver engaging training experiences.
Whether you need interactive courses, data capture solutions, or multimedia integration, our expert team can tailor your content to meet your unique business goals.
Additionally, our eLearning translation services ensure your content resonates across languages and cultures without losing impact or clarity.
