Forum Discussion
Create a Course Certificate in StoryLine! (with Java and HTML)
I noticed in Stephanie Harnett's most excellent post on user notes that can be printed or emailed that much of the java for the printing function was really just filling the print window with content by using html. I thought to myself, why not use this same method for creating a course certificate. So I did just that following the steps below:
1) Design a rough draft in PowerPoint (so I could see what elements I would want on the page and determine or create any graphics I would need.
2) Create graphics and publish them to the web. You will need to reference them using a full URL.
3) Create an HTML based certificate using your favorite html editor. Tables work really well. I discovered this on my 3rd try to get this right. (More on that later.)
4) In StoryLine, create a trigger to execute JavaScript
5) Use the JavaScript to create your print window contents by adding the lines of your html together (see screenr)
Publish and test.
Below is a copy of the certificate created by StoryLine. The blue text represents variables pulled form the course:
Anyone who is still working on this or is having this problem, read this:
http://elearningbrothers.com/printing-slides-articulate-storyline-2/
Always there when I need ya. I was going to do something similar to this on my portfolio sample. Thanks Owen.
Hey Owen,
Pretty good way to go
I've started to go exclusively JavaScript for generating certificates. Using a Web Object to hold the background graphic. Grr... attached.
Nice. This is why you are the master.
When you have a moment, I just posted a javascript question in the thread about pulling the participant's name from the LMS.So I developed my javascript and attached it to a trigger but nothing is happening. Not sure what I did wrong, but if you guys can take a look I would appreciate it.
One thing I noticed is a problem with your quotation marks. You need to look for the opening marks that java will see and make sure that you are not closing it in your html code. For example, here is a line from your current code (with a space added after the
Contents + = '';
The quotation opens before and closes right after. Text/css isn't contained in quotes at all as written. To solve this, use single quotes (') for your javascript and double quotes (") for your html or the other way around. Like this:
Contents + = '';ugh - adding the space didn't work. I've posted the example in the attached text file.
This is a bit above me I have not used Java before has any one a working example that I can look at, including the source story file.
Hopefully I can then get it to work!!!!!!!!
By the way, I've successfully deployed this using a relative link. I have my certificate graphics in a folder that I drop into the published files folder. For our LMS, I actually had to include the root folder as part of the relative link path. I discovered this by using a traditional relative link path and publishing the course. The certificate launched with the nice "red X" everywhere a graphic was supposed to be. Looking at the properties of the red X gave me the expected path the window was using to find the graphics. I updated the code, republished, and boom.... the certificate works great.
