Forum Discussion
Create a Course Certificate in StoryLine! (with Java and HTML)
Hi Owen. I know it has been a number of years since you posted this solution to printing a Certificate from Storyline via html.
I am trying to do just that and I have tried to follow a simplified version of your html code. I already have the variables I need in a certificate created in Articulate 360. I am just trying to print this screen so was hoping that the following html code would work but I cannot get a print screen to activate.
Can you help....
myWindow = window.open("","Print","width=900,height=700,scrollbars=0,resizable=0");
myWindow.document.write(contents);
myWindow.document.close();
myWindow.focus();
myWindow.print();
The code looks right to me. Can you share a file so I can peek under the hood?
I have a Rise demo that IF your browser security setting are right, shows you how to pass data between Storyline blocks. At the end of the course, I have an HTML certificate (also generated from a Storyline block).
You can check it out here: https://360.articulate.com/review/content/b56569f8-4679-4c5c-a937-738eb98cc3fa/review
The certificate code I'm using looks like this:
// Get variables from StoryLine.
var player=GetPlayer();
var studentName=player.GetVar("StudentName");
// Get date from computer and format it for the certificate.
var date = new Date();
var certificateDate = ((date.getMonth() > 8) ? (date.getMonth() + 1) : ('0' + (date.getMonth() + 1))) + '/' + ((date.getDate() > 9) ? date.getDate() : ('0' + date.getDate())) + '/' + date.getFullYear();
// Open a print window
myWindow = window.open("","Print","width=1056,height=816,scrollbars=0,resizable=0");
// Create the certificate by loading all the HTML code into a single variable.
var contents ='<html><style> @page {size: landscape;}</style><body><div style="width:900px; height:660px; padding:20px; text-align:center; border: 10px solid #0c4da2"><div style="width:850px; height:610px; padding:20px; text-align:center; border: 5px double #0c4da2"><br/><span style="font-family:Lato; font-size:45px; font-weight:bold">Certificate of Completion</span><br/><br/><br/><br/><span style="font-size:30px"><i>This is to certify that</i></span><br><br><span style="font-size:45px"><b/>';
contents+=studentName;
contents+='</span><br/><br/><span style="font-size:30px"><i>has completed the</i></span> <br/><br/><span style="font-size:45px"><b>Passing Variables<br>Between Storyline Blocks in Rise</span> <br/><br/><span style="font-size:30px">course.</span> <br/><br/><br/><br/><span style="font-family:Lato; font-size:30px"><i>Completion date:</i></span><br><span style="font-family:Lato; font-size:30px"><i>';
contents+=certificateDate;
contents+='</i></span></div></div></html>';
// Write the contents to the window and execute the print command.
myWindow.document.write(contents);
myWindow.document.close();
myWindow.focus();
myWindow.print();