• Skip to main content
  • Skip to footer

Bridgehill Learning Solutions

Richard Watson

  • About
  • Services
  • Testimonials
  • Portfolio
    • Client Projects (Snap Shots)
    • e-Learning Samples
    • My eBooks
  • Contact Richard
  • eLearning Matters
You are here: Home / elearningMatters / Capturing and Printing Learner Responses in Storyline 360

Capturing and Printing Learner Responses in Storyline 360

January 31, 2022 By Richard Leave a Comment

Here’s a quick mockup that I created using Storyline 360 and JavaScript. My goal was to collect learners’ input from three slides and then allow them to print their responses.

Mechanics

Each slide in this demo sample includes a photo from nature and a text variable field for the learner to comment on the photograph.

When the learner reaches the final slide, I provide them with the option to print their responses.

The Javascript behind the “Print Your Responses” button is shown below:

var myWindow = window.open("","Print","width=810,height=610,scrollbars=1,resizable=1");
var player=GetPlayer();
var pic1comments=player.GetVar("pic1comments");
var pic2comments=player.GetVar("pic2comments");
var pic3comments=player.GetVar("pic3comments");
var contents = "<html><head></head><body style='width:650px;padding:20px;'>";
contents+="<div style='height:20px;padding:10px;margin-bottom:20px;text-align:center;'><button onclick='javascript:window.print();'>Print My Notes</button></div>";
contents+="<div style='font-size:18px;font-weight:bold;margin-top:10px;'>Here are your comments.</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>Pic 1 Comments</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>"+pic1comments+"</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>Pic 2 Comments</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>"+pic2comments+"</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>Pic 3 Comments</div>";
contents+="<div style='font-size:17px;margin-top:5px;'>"+pic3comments+"</div>";
contents+= "</body></html>";
myWindow.document.write(contents);

Here you can see the results. From here, the learner can print to their local printer or print to a PDF file to save. Credits to Matthew Bibby for providing the initial JavaScript code!

Filed Under: elearningMatters

About Richard

Experienced L&D Consultant | Instructional Designer | eLearning Developer | Articulate MVP/Super Hero | Author | Jazz Connoisseur

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Footer

Let’s Work Together!

Contact Richard

Copyright © 2023 · Bridgehill Learning Solutions, LLC · Log in