Generate a PDF from Text Entry in Storyline
May 15, 2024
Hi everyone! I'm trying to learn how to use Java to have Storyline generate a PDF based on what the user puts into some text entry boxes. I'm not very tech savvy when it comes to writing code and need someone to explain these steps to me like I'm in kindergarten. I'm attaching the slide I want to do this for so you can see the vision-but ultimately, I want to learn how to do this with anything I want to format in Storyline-like an interactive worksheet or graphic organizer. Besides the Java piece, I'm lost on how to make the actual PDF template and make it so that it works. I can make a PDF and make it look like I want, but then what?
Apologies if this was a bit of a ramble-any help from this forum would be immensely appreciated! :)
3 Replies
Here is post on a similar topic https://community.articulate.com/discussions/building-better-courses/printing-multiple-text-entry-boxes-throughout-a-course-as-one-pdf-file
Hi Megan
The JavaScript code you copied into your sample screen came from a post and subsequent thread I put up last year. This had an example Storyline file showing how to do exactly what you require and I recognise the code from that example - so, hopefully, I should be able to help!
Creating downloadable pdf files in Storyline - an update on earlier methods - Articulate Storyline Discussions - E-Learning Heroes
Firstly, some basics about how this method works:
Most JavaScript apps rely on one or more JavaScript code libraries. These libraries are sets of open source code routines that are created by teams of volunteer programmers. The code libraries can be downloaded (for free) from a repository and can be used by developers under their open source licence.
The method I described in my article uses a JavaScript library called pdf-lib. This is an extremely powerful set of methods for creating and editing pdf files. One of the unique features of this library, and what makes this code so useful here, is that it contains functions that can open, read and fill in a pdf form.
A pdf 'form' is a special type of pdf file that contains named 'fields'. These fields are normally filled out by the user who can do this by tabbing through the document entering the data required. But in this case it is the pdf-lib JavaScript code that can open the form, read the field names and then we can copy the Storyline variables we have collected from the text entry fields in our Storyline module into those fields before we close the completed form as a new file which we then offer to the learner for download.
So what you need to do is:
Step 1 - design and create your pdf output file - sounds like you already have that covered.
Step 2 - Convert your pdf file to a pdf form (I use Adobe Acrobat to do this - there may be other pdf editors you can use - but they MUST be able to create a form!). You insert 'fields' and create names for those fields where you want the learner's input text to appear in the pdf document. Note and list the fieldnames you have used.
Step 3 - In your Storyline module, capture and store the input from your learner in Text Entry blocks and make a note of the Storyline variable names you have used for each field. I use a spreadsheet mapping the Storyline variable names to the pdf form field names.
Step 4 - now pick up the JavaScript code you copied and see if you can work through how it operates
Thank you so much for taking the time to reply to me! And yes-I tried to take your example and make it my own-but clearly did not understand the mechanics of things. I'm going to give your directions a try and will let you know if I have questions. And thank you again-I really appreciate it!