Create and Edit Certificate Templates in the Admin Platform

This guide explains how to use the certificate template editor in the Admin Platform.

Use it when you want to:

• create a new certificate template
• edit an existing certificate template
• upload or replace the certificate background
• position learner name, course name, date, and QR code
• adjust certificate text styles and spacing
• preview the final certificate layout before saving

Open The Certificate Editor

You can open the certificate editor in two ways:

1. Go to Management > Certificates.
2. Select Create to build a new template, or open an existing certificate and choose Edit.

OpenMirai then opens the certificate editor.

Understand The Certificate Editor

The certificate editor includes:

• a header with a back action and editor controls
• a save bar
• a live certificate canvas preview
• a settings panel for certificate details and element controls

The editor uses the same main workflow for both create and edit mode.

The main difference is:

• Create saves a new certificate template
• Edit updates an existing certificate template

Know The Screen-Size Limitation

The current certificate editor is not intended for small screens.

If you open it on a small screen, OpenMirai shows a message telling you to use a larger screen.

Use a desktop or larger display when you need to create or edit certificate templates accurately.

Use The Save Bar

The save bar appears when you make changes in the editor.

Use it to save the template after reviewing your edits.

After saving:

• create mode returns you to the certificate list
• edit mode also returns you to the certificate list

Set Up Certificate Details

The Certificate Details section includes the template’s main setup fields:

• Name
• File
• Categories

Use this section when you want to define the template itself before adjusting the design.

Important details:

• the File field is used for the certificate background image
• OpenMirai expects an image background
• the file guidance on the page recommends using an A4-sized layout
• categories can be used to organize certificate templates inside your library

Use The Live Certificate Canvas

The certificate canvas shows a live preview of the certificate while you work.

The preview can include:

• the certificate background image
• learner name text
• course name text
• date text
• QR code

Use this preview to see how the certificate will look before saving it.

Move Elements On The Canvas

OpenMirai lets you drag the certificate elements directly on the preview.

You can reposition:

• learner full name
• course name
• date
• QR code

This is useful when you want to align the certificate with your background design instead of relying only on form fields.

Adjust Learner, Course, And Date Text

The editor provides a separate settings block for:

• Learner Full Name
• Course Name
• Date

For each text element, OpenMirai lets you adjust settings such as:

• bold or italic style
• font size
• font family
• color
• alignment
• line height
• letter spacing
• maximum width

Each text block also includes a preview field so you can type sample text and see how it looks on the certificate.

Use these settings when you want to refine both the style and the placement of certificate text.

Add Preview Text

The editor includes preview inputs for:

• preview learner name
• preview course name
• preview date

Use these fields to test how long names, course titles, or dates will appear on the certificate.

This helps you catch layout issues before the template is used in real courses.

Adjust The QR Code

The QR Code section lets you control the QR element used for certificate verification.

Use it to:

• change the QR code size
• drag the QR code to a different position on the canvas

This is useful when you need the QR code to fit the design without covering important text or graphics.

Use Zoom And View Controls

The header includes controls that help you work with the preview more comfortably.

Available controls can include:

• Zoom in
• Zoom out
• Fit to screen
• Recenter
• Show grid
• Grid size

Use these tools when:

• you need a closer view for precise placement
• you want to reset the canvas after moving it
• you want a grid to help align certificate elements

Use Grid And Alignment Helpers

When the grid is turned on, OpenMirai shows alignment helpers on the canvas.

Use these when you want more precise positioning for text or QR elements.

You can also change the grid size to work with a tighter or looser layout guide.

Move The Canvas View

The editor allows you to move the canvas view itself in addition to moving certificate elements.

Use this when you want to inspect a different part of the certificate more easily while keeping the current zoom level.

If the view becomes awkward, use Recenter to bring it back to the middle.

Use The Sidebar Or Settings Panel

On wide screens, OpenMirai shows the certificate settings in a right-side panel.

The editor also includes controls to:

• hide the sidebar
• show the sidebar again

On narrower but still supported screens, OpenMirai can show the certificate settings in a dialog instead of the full desktop sidebar.

Use whichever layout is available to continue editing the same template settings.

Save A New Template

When creating a new certificate:

1. Enter the certificate details.
2. Upload the background image.
3. Adjust text and QR elements.
4. Review the canvas preview.
5. Save the template.

OpenMirai then adds the template to the certificate library.

Update An Existing Template

When editing an existing certificate:

1. Open the template from the certificate library or detail page.
2. Update the background, categories, or element settings as needed.
3. Review the live preview.
4. Save the changes.

Use this flow when a certificate design needs refinement after it is already in use.

If The Editor Is Loading

When you open an existing certificate, OpenMirai can show loading placeholders while the template data is being loaded.

Wait until the current template details appear before making major changes.

If A Field Needs Attention

If required information is missing or invalid, OpenMirai shows validation feedback in the affected field.

Common examples include:

• missing certificate name
• an invalid or unsupported background image
• invalid text settings

Review the highlighted field, correct it, and save again.