The free Certificate addon of Quiz and Survey Master gives you the option of creating a certificate for users who pass your quizzes or tests; you can customize the title of your certificate, and its message, add a background, add a logo and even choose a different font by specifying the font family.
INSTALLATION/SETUP
Once you have purchased the addon, you will have access to download the addon. To install, simply upload the addon as a normal WordPress plugin. To do so, go to the Plugins page and click Add New. Then, click Upload. From there, upload the zip file that you downloaded when downloading the addon.
Once the addon has been uploaded, you should now have the plugin QSM – Certificate listed in your list of plugins. Activate that plugin. Once activated, the plugin will create a new tab in the Quizzes/Surveys list labeled Certificate.
SETTINGS/CONFIGURE
Before you can use the Certificate addon, we must first enter the license key.
Adding Your License Key
Enter your license key from your account into the “Addon License Key” field on the “Certificate” tab of the “Addon Settings”.
Once you have entered your license key, be sure to click “Save Changes” to save the page.
After adding the License Key, you can now use the “Certificate” tab when editing your quizzes or surveys.
There are going to be times when you would like the user to be given a certificate after taking a quiz. To start setting up your certificate, first edit your quiz. Now, navigate to the Certificate tab.
Enable Certificate
To turn on the certificate feature, set “Enable Certificates For This Quiz?” to Yes.
Orientation
It lets you set how you would like to display the certificate to your users. You can go with Portrait (Vertical) or Landscape (Horizontal).
Custom Style
QSM Certificate comes with a default “dejavusans” English font, you can go with the default font or add a different font using Google Fonts. To add a new font, follow these steps:
If you want to set a language other than English, you need to import the CSS of that Specific Font from Google Fonts.
- Goto Google Fonts
- Copy the Font’s Import CSS (without style tag)
- Paste it into the “Certificate Font Family” field of the Addon
- Copy the font-family rules and paste it into the field inside the body{} (as seen in the below image)
- Next, enter your text in the said language inside the content field, and Save Settings.
You can add other CSS properties like padding, color, etc. along with the font CSS in the Custom Style Field of the Certificate Addon.
padding: 20px;
color: red;If you are importing fonts with multiple styles and font weights then it’s better to go with any single font weight that you prefer the most. For example, in the below example, we are using Google’s Alkatra font which comes with multiple styles and font weights. However, we’ve chosen Alkatra Medium 500 as our preferred style.
Title
Next, fill in the “Certificate Title” text box. This will be the first line on the certificate.
Content
Enter the Main Content, this will be the main body text on the certificate. You can add a line by pushing the enter key and can make use of any of the variables in the Allowed Variables section to the left. If needed, refer to our Template Variable system guide.
If you are copying the text from other sources and pasting it in the Content field, make sure you paste it without any text formatting by Ctrl+Shift V (on Windows) and Option+Shift+Command+V (on Mac).
Some fonts don’t support Bold & Italics, if you are using Bold & Italics text formatting with a different Google Font make sure that it is originally supported by the font, if not the certificate output will be plain text.
Note: Enter the text in the same Language of which you’re using the font family.
Logo URL
To add the logo, fill in the “URL To Logo” section with the URL to your logo. The logo must be in JPG, JPEG, PNG, or GIF format.
Logo CSS
Want to align the logo to a specific location on the certificate? you can do so with CSS. Just add the CSS properties and style your logo as per your requirements.
Background Image
For adding the background/border, simply fill in the “URL To Background Img” section with the URL to your background. The background must be in JPG, JPEG, PNG, or GIF format.
Don’t forget to click the “Save Settings” Button when you are finished!
Activation Expiration Settings
Configure how long a certificate remains valid by choosing between “Never Expire,” “Expiry Date,” or “Expiry Days.
Never Expire: Choose this option if you want the certificate to remain valid indefinitely for the participant.
Expiry Date: This allows you to set a specific date after which the certificate will no longer be valid or available for use and download.
Expiry Days: With this option, you can define a specific number of days the certificate remains valid. The expiration is calculated based on the selected number of days from the date the certificate has been issued (the current date).
If you select any of the radio buttons, then the corresponding option will be displayed to you. For example, if you select Never Expire then you will not see the expiry date and expiry days fields below.
In case, you opt for the Expiry Date, then only the “set expiry date” field will be available for you to configure. Similarly, if you select Expiry Days, then only the “set expiry date in X days” option will be visible.
Note – Make sure to include the template variables like %CURRENT_DATE%, and %EXPIRY_DATE% in the content body to display the date your certificate will expire.
Add Certificate ID Prefix
You can add a custom starting text to the certificate IDs to match your organization’s style or make them easier to identify. Using the certificate id you can check whether your certificate has been valid or not.
Note – Add the %CERTIFICATE_ID% in the content body to display the certificate ID to use to check your certificate’s expiry validation
Add form with a shortcode to check expiry
The shortcode quiz_expiry_check can be added to pages, posts, result pages, or emails. It lets users check if their certificate is still valid by entering the certificate ID, which can be found on the certificate. This ID can be used anytime to verify the certificate’s validity.
Adding Variable to Results/Emails Page
Once you have your certificate set up, simply add the %CERTIFICATE_LINK% variable to any results page or email. This will then show a link for the user to download/print the certificate.
If needed, you can also create a duplicate certificate after the user has taken a quiz by viewing the user’s results on the Results page. From there, simply go to the Quiz Tools tab and click Create Certificate.
Sample Certificate in Default English:
Sample Certificate in Hindi Font:
If you have any trouble implementing the Certificate Addon or have more questions about the process, please fill out a support ticket by going to the WordPress dashboard and selecting ‘help’ in the QSM plugin and our support guru will be able to help you.
Still stuck? How can we help?
