Primary Use Cases for Custom Print Outputs
- ✓Personalized Handouts
Compile learner reflections, journal responses, or notes into a clean, printable document.
- ✓Action Plans
Allow learners to export custom goal-setting matrices or scenario action plans at the end of a module.
- ✓Custom Certificates & Logs
Generate detailed activity completion summaries without relying solely on default LMS reporting.
Step-by-Step Implementation Guide
-
01
Prepare the HTML Print Template
Download or create a lightweight HTML print template (
print_template.html) formatted to style and arrange your exported text fields. -
02
Set Up Storyline Text Variables
- Insert Text Entry fields onto your slide canvas.
- Assign unique text variables (e.g.,
LearnerNote1,LearnerNote2) to capture user inputs.
-
03
Embed the Web Object Template
- Go to the Insert tab on the Storyline ribbon and select Web Object.
- Browse to the local folder containing your custom HTML template file.
- Resize the inserted Web Object container and position it entirely outside the visible slide preview stage.
-
04
Add Action Triggers and JavaScript
- Create a Submit button to pass variable values to the embedded frame.
- Create a Print Result button and attach an Execute JavaScript trigger when clicked:
var player = GetPlayer(); var text1 = player.GetVar("LearnerNote1"); var text2 = player.GetVar("LearnerNote2"); // Communicate with the embedded Web Object window to trigger print command var webObject = document.querySelector('iframe'); if (webObject) { webObject.contentWindow.postMessage({ note1: text1, note2: text2 }, '*'); webObject.contentWindow.print(); } -
05
Publish and Validate
Publish your project to Web or LMS format. Launch the published course on a web server to verify that the print dialog triggers and renders formatted text entries correctly.
Workflow Component Reference
| Component | Function in Workflow |
|---|---|
| Text Entry Variables | Collects dynamic learner inputs dynamically during course runtime. |
| Web Object (Off-Stage) | Holds the external HTML/CSS print template without cluttering slide visuals. |
GetPlayer().GetVar() |
Fetches live Storyline text values to pass into the print layout script. |
contentWindow.print() |
Triggers the native browser print/save-to-PDF window from the embedded document. |
Frequently Asked Questions
Will this print function work when running the published course locally?
No. Modern browser cross-origin security policies block iframe communication on local file systems (file://). Courses must be uploaded to a web server or LMS environment.
Can learners save their output as a PDF instead of printing to paper?
Yes. The native browser print interface launched by window.print() allows users to select "Save as PDF" as their target destination printer.
Why position the Web Object outside the slide canvas preview area?
Placing the Web Object off-stage keeps the HTML container invisible to the learner while keeping the document active in the DOM structure for JavaScript calls.