Forum Discussion
Storyline 2 Example - Generating a PDF Certificate for users who successfully complete a quiz
Hi all,
I've been experimenting with a JavaScript PDF library (pdfmake) to generate PDF certificates client side for learners who have successfully completed a quiz in Storyline 2.
You can see an example at http://rlowry.github.io/certificate/story.html
The 1st slide of the example provides a brief overview of how this works. I've tested this successfully in Internet Explorer, Chrome, Firefox, Chrome on Android and Safari on iOS.
I've attached a simple source file that contains a basic .story file as well as a folder (certificate) that includes the required HTML and JavaScript that needs to be included within a web object within the project. Feel free to have a look and re-use if it's useful.
The generated PDF certificate is very basic at the moment, you'll need to refer to the pdfmake documentation to update the design.
UPDATE: Originally this example only worked with the HTML5 output. I've tweaked it so it now works with the Flash output as well. I've updated the attached files to reflect this change.
UPDATE 2: I've updated the attached source files so they now use the latest version of pdfmake (v0.1.27).
Cheers,
Ryan
Hi Makayla,
I know the original example mentioned a Javascript behavior and a web object, the latter of which would need internet access, so that sounds like where you're run into a hiccup. Since the Javascript is outside my area of expertise and support it may also be worth messaging other users on this thread directly using the "contact me" button in case they're no longer subscribed to this discussion.
Would this work for a course that needs to be published for CD? The clients will be taking it completely offline.
Hi Makayla,
Based on your other post here, it sounds like you would be ok with a final slide that acts as a certificate and that users could take a screenshot of? If so, that would likely be the easiest way and would ensure that it would work for them offline as it's not going to rely on generating that report.html file.
A screenshot would definitely work if it could happen by trigger. The demographic of clients require us to be VERY simplified. Instructing them to open a separate screenshot program or even pushing the PrintScreen button and then needing to explain what to do after that is too much for them. Is there a function we know that will capture the image on the screen and download/save it as a png/jpeg? I think my best bet is having a trigger that downloads a txt file that has the "certificate" language on it. However, I would need it to immediately pop up in a separate window so that they are not clueless searching for the file on their hard drive. Technology is hard haha especially trying to find the write technology path to cater to people who don't use technology! hahaha
Hey Makayla,
I totally understand that - I tech support my mom all the time. It's hard. ;-)
Happen by trigger <- That's the part that is likely through the Javascript which is well beyond my expertise (and not something our team can offer support for) but I don't doubt that it's possible!
This forum discussion is a bit older, so I may also suggest writing a new post with the specifics of what you're looking to accomplish - that may get a bit more eyes on it. Also feel free to reach out for help in the Building Better Courses side of the forums as folks tend to share more design and how to ideas there. Also, there are a few users that you'll see throughout these discussions who seem to be "Javascript experts" you could also message them directly using the contact me button on their profiles to see if they can offer you some one on one help.
Best of luck with your project!
Hi there.
Does PDFmake not work anymore? Their website does not seem to work (http://pdfmake.org/).
I'm looking to create a certificate of completion for one of my courses. This is exactly what I was looking for; user fills out their name, takes the quiz, then generate a PDF of the certificate. But, now I don't know the best way to edit the "certificate.html" to customize it for our branded certificate since PDFmake does not work. I'm not very familiar with code. Does anyone have any ideas or know of any other tutorials out there that will generate a PDF of the certificate?
Hello Arhip - Not a site I'm familiar with. Hopefully someone in the community will be able to chime in and assist you here. I saw another thread here with a similar conversation. Not sure if that will assist you.
Arhip, the link above seems to circle back to this post but you can search pdfmake in the discussions. I did so but didn't see any update on the status. I sent a message to Ryan to let him know there were some additional questions that he may provide answers to. I don't feel completely confident in using this feature if pdfmake is not available in case Ryan or anyone else needs (or wants to) make updates, but I really have no idea about that. Maybe there is an alternative to pdf make? I did read about customizing the background of the certificate with a graphic and adding a bit of additional information such as the user's score somewhere in this thread.
Sweet! Thanks Ryan!
Dear Ryan,
seems like the PDFMake Project was updated and now also include .jpg and .png functionality (link). However, even if I do not use the image functionality and only replace your pdfmake JS files by the 4 new pdfmake JS files, the script does not work anymore. Maybe you have an idea? Would be really great!
Thx.
Hi Ryan,
I'm not sure what I'm doing wrong, but I can't get this to work.
I uploaded the certificate folder into the same directory as my 'Storyline' subdomain (where I have my published story stored). I created a new web object with the link to: http://www.MYWEBSITE.com/subdomain/certificate .
It still is not working, do you know why this may be? I'm publishing as LMS with SCORM 1.2.
All the best,
Stef (:
Update: tried publishing as 'Web' and it is still not working
Update 2: Here is the text given within the WebObject:
403 - Forbidden Error
You are not allowed to access this address.
If the error persists, please contact the website webmaster.If you are the webmaster of this site please log in to Cpanel and check the Error Logs. You will find the exact reason for this error there.
Common reasons for this error are:
Incorrect file/directory permissions: Below 644.
In order files to be read by the webserver, their permissions have to be equal or above 644. You can update file permissions with a FTP client or through cPanel's File Manager.Restrictive Apache directives inside .htaccess file.
There are two Apache directives which can cause this error - 'Deny from' and 'Options -Indexes'."My permissions for the subdirectory are 755, so I'm not sure why this is happening. Any ideas?
