Storyline 360 - Generating a PDF Certificate using JavaScript

I wondered if anyone could give me direction on how to edit the "lorem ipsum" text on the certificate? 

Hey Jessika. That text is part of the SVG background image used in the example. You'll find this included inline within certificate.js on line 45 as shown below. This isn't easily editable. Instead you'll probably want to specify your own background image.

background: [
    {
        svg: 'SVG_BACKGROUND_IMAGE_INCLUDED_HERE',
        width: 841.89,
        height: 595.28
    }
],

You can find more about including SVGs in the pdfmake docs - https://pdfmake.github.io/docs/0.1/document-definition-object/svgs/

Alternatively you could insert a jpeg of your own design -  here: https://pdfmake.github.io/docs/0.1/document-definition-object/images/

i am SO super delighted that i've managed to ALMOST create a certificate.  HOWEVER, I can't for the life of me work out how to get the variables in.
I have spent 3 hours on it and i'm going nuts.

also - not sure how everyone else gets their code in that fancy grey box......

I really appreciate you sharing this valuable information.

And next question - how do we get the download to have a name rather than file.pdf?

so it needs the quote marks rahter than this

pdfMake.createPdf(docDefinition).download('Capability 5');
}

Matt I wish you hadn’t said that, I just built a CV builder using Storyline with a PDF output and now I am going to have too go and change it!

Hi Ryan, not sure what we are doing wrong. We followed all the steps but still can't seem to make the course work to produce the certificate when published to Articulate Review, or the LMS sandbox we use. The only difference I can see from your example Story file and ours is on the "Success" layer of your last slide there is a "web object" but I'm not seeing in the steps how this Web Object is established in the Articulate Story file. Would you be able to provide clarity on how we can establish this?

Thank you in advance!

Doug

Are you also able to share the files from the web object embedded on the success layer of the results slide?

Doug, looking at the .story file you've provided I think you are mixing two different methods of generating a PDF in Storyline. Were you following this tutorial by any chance? Rather than embedding a web object which contains the files required to generate a PDF you need to edit the published output and modify it to include the files required to generate the PDF. This is described towards the end of the tutorial under the heading "Publish and Modify the eLearning Output".

If you wish to follow the method outlined in this post you'd need to copy the JavaScript trigger as found in the .story file in Source.zip e.g.

// Name of the certificate html file

var certFilename = 'certificate.html';

// HTMLCollection of elements of type iFrame

var iframeElements = document.getElementsByTagName("iframe");

// Iterate over the iFrameElements HTMLCollection

for (var i = 0; i < iframeElements.length; i++) {

  /* If src of current iFrame element equals the filename set in variable

     ** certFilename call the generatePDF() function.

     */

    var src = iframeElements[i].getAttribute('src');

    if (src.indexOf(certFilename) != -1) {

        iframeElements[i].contentWindow.generatePDF();

    }

}