Customize Course Completion Certificate

You can create your own template which would be used as a certificate template.

There are three ways to create a customized certificate

1. Using custom html coding and Velocity scripting language, which is explained in this article.

2. Using PDF template with form fields which get replaced by application, this method allows you better control especially if you do not have development background.

3. Using HTML only code

So let's look at how the customization works using html coding and velocity scripting.

Step1: Go to Site Admin->CMS and click on New Certificate Template

Step2: You can create as many templates as you like, and at course level you can select which one you want to use. If you name the template to course_completion_certificate it would override the default template for all courses (name has to be in exact same case). Otherwise you can name it anything you like and use it in specific course(s).

Step3: In the content, you can enter HTML formatted code, and save and publish the template. This code would be executed for generating the certificate. Example template code: 

Step 4: Once you are done with editing content, click the Publish button at the bottom of the page. 

Linking Certificate to Course

To link a certificate with a course, you can edit the course's properties in the course editor, and select a certificate template from the drop down. Note that certificate drop down will only appear if there are any existing templates in the site.

Code Explanation

• Course Name: this is printed by $courseSession.getCourse().getName() - $courseSession.getCourse().getCode() line. It prints both course name and code with hyphen in between.
• Students's Name: this is printed by ${student.firstName} ${student.lastName}
• Grading scheme in the course session is tested by checking value of $gradingScheme.getDisplayType().name()
• Default grading scheme would be PERCEN
• Percent grade is printed by line - $Utility.format($grade.getPoints(), 0, 2)% . Here we show the percent with 2 decimal places.
• Date of completion is shown by - $DateFormatter.getFormattedDate($grade.getModifiedDate(), "dd MMM yyyy")
• Rest of the HTML is simply a table, and appropriately spaced cells. You can adjust these according to the background image you use.

Changing the Template Background

Step 1: create an image with 792px × 612px dimension.  See attached image for example.

Step 2: create a new Site Page from CMS, and name it something like resources, upload the above image as an attachment in the page (you don't have to publish this page, this page acts just as a wrapper to hold the attachment).

Step 3: Close the editor, by clicking on Site Page link while you are in the editor, you will see list of attachments in the page

Step 4: click on the uploaded image, which would open the image in the browser, copy the URL shown in the browser address bar. [e.g. https://xyz.edubrite.com/oltpublish/att/34e6e99a-d45e-11e1-a737-00163e003984]

Step 5: note the id of attachment in the url 34e6e99a-d45e-11e1-a737-00163e003984

Step 6: now open the customized certificate template and add following as the first line in the template

$MAIN.setBackground("34e6e99a-d45e-11e1-a737-00163e003984")

Change the id of the image with your id.

Customization Parameters

Following are the list of parameters which can be used to customize the content of a course completion certificate. Use the value specified in the Code Script column in the certificate code to print a specific parameter.

Course Parameters

Grade Parameters

Learner Parameters

Utility Methods

• $Utility.format(inpValToFormat, minFractionDigits, maxFractionDigits)
• $DateFormatter.getFormattedDate(date, formatString)

Using Velocity to create custom variables

1. You can capitalize the string by using toUpperCase() function e.g.
${student.getFirstName().substring(0,3).toUpperCase()}

1. Simple multiplication -

#set($s = 10 * $grade.getCredits())
#set($creditHours = $s.toString($s))
$OUT.put("grade.credits", $creditHours)

2. Convert to hex for numeric value

Suppose you have a cusom numeric property for each user, called Identification and you want to print it in certificate, in hex format
$student.getProperty("Identification”)
#set($I = 0)
#set($s = ${student.getProperty("Identification").trim()})
#set ($NUM = ${I.parseInt($s)})
$NUM.toHexString($NUM)