Example files: Generating a certificate from Storyline

Hi Carolyn,

Unfortunately, you can't access the results variables directly through GetVar. You'll need to add a trigger on your results slide to copy the score into another variable then reference that variable through JavaScript. 

Steve

Thanks Steve. I'll give it a go.

Hi Steve

I've had a go a what you suggest, but I'm struggling a bit. The score is still not displaying on the certificate so I'm obviously doing someing wrong. I've taken the following steps:

I set up a new variable called Score and assigned it a numeric value

I then set up a new trigger which 'adjusted' the variable 'Score' equal to the variable Results1.ScorePercent when the user clicks the object "Create My Certificate".

Then in the html I have:

.score {
    position:absolute;       
        left:520px;   top:500px;   width:320px;   font-family:Arial, Helvetica, sans-serif;   font-size:40px;        color:#cc00ff;   z-index:2;}

var learnerScore=player.GetVar("Score").toString();
        document.write("

Can you point out where I'm going wrong.

Thanks for your help.

All sorted, thanks for your help.

Totally missed this thread and went about this in a slightly different fashion. Instead of calling up an html page that runs the calls to storyline for the variables. I used java to create the html page from within storyline.

See my solution here: Link to Thread

I used a table in my example because the background image was not printing in I.E. but I might give it a go again using Steve's most excellent html.

Way late to the party...but how do I set the font size for inputing the learner name into the certificate. I've got my own certificate generated, but I can't figure out how to control the font size.

I used a style guide in the html. Something like this....
< style type="text/css"> 

h2 { font-family:"Segoe Script"; font-size:20px; color:#333333}

Then you can use h2 as an html tag before the learner name. Like this:

< h2>'+LearnerName+'</h2>

Thanks to everyone in this thread for the collaboration. I was able to implement this method and it works wonderfully - in Firefox and Chrome. But in IE, the "Print Certificate" button I added to my results slide is unresponsive. Nothing happens when it's clicked. In Chrome and FF, clicking it launches a new broswer window with the certificate.

Since the training is playing in Moodle as a flash module, there's no browser error to help me troubleshoot the problem. Has anyone else had problems with this method working in IE? Any help or guidance is greatly appreciated!

Thanks.

Hi,

I followed the steps in the post, but when the certificate is supposed to pull up, I get an error. My module eventually is zipped and uploaded into an LMS where it is hosted. Will the steps in the post still work for that? Also, is the "published output directory" different from the output folder that is created when I publish my articulate module? 

Thank you,

Tria

Hi Tria,

The zipped module uploaded to your LMS shouldn't be the cause of any problems. That's how I have mine working as well (using Moodle) and it works just fine. 

Not sure how others have done this, but I simply uploaded the 2 files (the .html and the certificate image) into a folder inside the same host where my Moodle installation lives. For example, my files live at http://www.mydomainname.com/certificate/certificate.html and http://www.mydomainname.com/certificate/certificate.jpg. /certificate is my "published output directory". 

So here's how my javascript reads:

var newWin=window.open("http://www.mydomainname.com/certificate/certificate.html", "http://www.mydomainname.com/certificate/certificate.jpg","status=0,scrollbars=0,width=950,height=605");

Hope this helps!