Home > Help center > Management Panel Manual > Management - Email Templates

Management - Email Templates

Like any business, communication with the customers is vital. Whether it is an automatic notification, an offer, or an update, sending emails is the standard method for communication. Still, with the growth of the company, this could become harder to accomplish properly.

The Email Templates feature sets the creation of patterns for sending emails, their templates and visualizations, by using a MJML code and custom templates.

email-templates-preview

The entire subsection is divided in two parts: Appearances and Templates.

Note: The subsection Email Templates under the Management category in the Billia Management Panel is designed the same way as the subsection Document Templates.

Appearances

This part of Email Templates contains guidelines for the Appearance of the email, i.e. sets whether header and footer would be present, how they look, the size and shape of the font, the logo, etc.; i.e. - the overall style. This is done by using the MJML language.

email-templates-appearances

Multiple Appearances can be created. Each one is a "guideline container" for the finished outlook of a generated email.

The list previews Appearances with their respective unique ID, title, and modification tools. Clicking on the ID enables the Appearance for editing.

Available Admin actions

Control buttonDefinitionDetail
edit2Edit- Edit the Appearance, same could be done by clicking on the ID.
-deleteDelete- Delete the Appearance.
add-new1Add new- Create a new Appearance.

Note: The system converts the MJML data to HTML and stores it. Completing the edit of an already exiting Appearance will prompt the system to ask whether it should rebuild all emails already using that Appearance. Choosing "yes" will reformat all, choosing "no" will just save the Appearance modifications without reformatting any previous files. Still, all following emails using that Appearance will be generated with the last changes made.

Create a new Appearance

Creating a new Appearance requires to complete certain fields:

add-email-appearance

FieldDetails
Appearance name- Set the title for the Appearance. This way when multiple Appearances are present, the Admin can differentiate them by purpose.
MJML- The MJML code for the appearance design/style is written here.
Preview- Choose an already existing template from the drop-down list to see a preview of that appearance.

Error checks

For optimum convenience, the system has an embedded MJML checker on the page. When the MJML code above is incorrect in any way, it will display an "Error parsing MJML" message.

mjml-error

Note: When choosing to create a new Appearance, the Create Appearance page shows up blank, which automatically prompts the Error checker to display an MJML error. This is the default behavior of the Error checker and is caused by the MJML field being blank.

Available Admin actions

Control buttonDefinitionDetail
turn-on-or-offDefault- Allows for one Appearance to become a default choice for any email templates that don't have a specific Appearance attached to them.
beautifyBeautify- In case it is needed, clicking this button will arrange to MJML properly.
save-changes2Save- Save the appearance at its current state.

Note: The Beautify button cannot fix errors in the MJML, it can only fix the arrangement of the rows and spaces, so that the code is more easily readable.

Templates

The Templates section sets and manages all email templates. The templates represent the actual content of the email files.

The list displays the Templates with the option to be edited and expanded for details.

email-templates

Available Admin actions

Control buttonDefinitionDetail
-searchSearch- Search through templates per key word.
edit2Edit- Edit the template.
expand1Expand- Expand the template for further details.
add-new1Add new- Create a new template.

Expand a template

Each template can be expanded to view more information about it. It also shows more available Admin actions.

expanded-email-template-view

Depending on the integrated languages in the system, each template can be created in more than one language. The expanded preview will show the template in all languages it has been generated. It will also display its Appearance, notification type, and the date of creation.

Available Admin actions

Control buttonDefinitionDetail
edit2Edit- Edit the template in the specific language. This will open the template's editing page on that specific language. The same action can be prompted by also clicking on that template's ID or title.
-deleteDelete- Delete that specific language template.
json-detailsExample data- Click to see an example of the type of information and order it would be set.

Example data

Clicking on the Example data button will provide examples on the type and structure of the information provided. This option is divided in two panels - Preview and Edit.

The Preview panel visualizes the information in a JSON format, where there are strings (in red) and integers & floats (in blue).

email-template-example-data-preview

The Edit panel visualized the information as available for modification in cases where the Example needs to be updated.

email-template-example-data-edit

Note: The Example data cannot be deleted or removed. The only workaround is to leave it blank.

Available Admin actions

Control buttonDefinitionDetail
show-more-categoriesExpand line- Click to show subrows and more information.
show-less-categoriesHide details- Click to hide subrows.
save-codeSave- Save changes.

Add a Template

Adding a new template and editing an already existing one require the completion of the same fields. It is again based on the MJML language and works together with an Appearance. Each template can be created in as many languages as there are set in the system. On the top of the page there is a separated sub-panel for each language.

The example screenshot below shows two available languages - Bulgarian and English.

create template email

Available Fields

FieldDefinition
Name- Set the name for the template. This will be visible in the list of templates and dropdown template sections in order to differentiate between them.
Title- This refers to each language selection. Here, the respective short explanation for this template in the respectively selected language is set. The title will be visible in the Management Panel list of templates details.
Appearance- From this dropdown menu is where an Appearance is set for the template. In order for this to be done, the Appearance needs to be already created.
Notification type- Set the type of the email template, in case various types are created.
Status- Set if the email template is enabled or disabled.
MJML- Type in the MJML code to shape the template.
Preview- Displays a whole preview of the template with the selected template embedded.

Available Admin actions

Control buttonDefinitionDetail
expand3Expand more data- Clicking this will expand a side panel with more information on Variables and Functions.
Alternative textBeautify- Will fix the rows arrangement of the MJML.
Alternative textTest Template- Allows for the email template to be tested first.
Alternative textSave- Save changes made to the template.

Test Template

Testing the email template may prove necessary before official use. The respective button allows for this action to be set. The test email could be either sent or visualized only.

test the email template

Available Fields
FieldDefinition
Test type- Choose how you want to test the email template. "Send email" will visualize and send the test email to the respective email address set in the second field. "Render Template" will only visualize the test email template on the same screen without sending it. Both Test types use the data from the Variables chosen for the MJML field. "
Send to- Type in the email address that will receive the test email. Used for type "Send email".
Language- Choose the respective language for the testing of the email template. This language should first be supported and embedded into the system.