We have a few other ways to customize the certificate template, for example
- PDF Designed in Adobe Professional with fillable fields
- PDF output with custom background image, and HTML/Velocity code
This article describes how to create a certificate template without requiring any outside resources (PDF or images), here are the steps
Step 1: Go to Site Admin->CMS and click on create new certificate, assign it a name ending with .html. For example it could be named certificate.html
Step 2: Add a HTML code with your specific design and variables you want to print (see the list of variables here). See the below example code. The variables and velocity script code are highlighted
<div style="width:800px; height:600px; padding:20px; text-align:center; border: 10px solid #787878"> <div style="width:750px; height:550px; padding:20px; text-align:center; border: 5px solid #787878"> <span style="font-size:50px; font-weight:bold">Certificate of Completion</span> <br><br> <span style="font-size:25px"><i>This is to certify that</i></span> <br><br> <span style="font-size:30px"><b>$student.getFullName()</b></span><br/><br/> <span style="font-size:25px"><i>has completed the course</i></span> <br/><br/> <span style="font-size:30px">$course.getName()</span> <br/><br/> <span style="font-size:20px">with score of <b>$grade.getPoints()%</b></span> <br/><br/><br/><br/> <span style="font-size:25px"><i>dated</i></span><br> #set ($dt = $DateFormatter.getFormattedDate($grade.getAwardDate(), "MMMM dd, yyyy")) <span style="font-size:30px">$dt</span> </div> </div> |
Step 3: Publish the certificate
Step 4: Edit any course in the editor, assign this certificate to the course from the properties tab.
Now open any course transcript and click on print certificate option to view how it appears. Here is the sample output for the above code.
User Interface
- UI Customization
- Customization using Site Placements
- CSS Customizations
- Customizing Date Format
- Customize Sorting
- Customizing Labels (Captions)
- Signup Page Customization
- CMS Overview
- Getting Started with CMS
- Example of using CMS
- Catalog Customization
- Templates
Custom Properties
- Custom User Attributes
- Site level Custom Properties
- Custom property entity specific
- Multiple Languages / Default Language
- Custom File Types (Downloadable files)
Email Customization
- Email Templates Customization
- Email Override
- Email Variables
- Email Scripting - 6 Examples
- Add recommended Courses in completion email