Creating Email

To create your first email, follow the next steps.

Step 1. Go to Email Creation

To start building an email, choose one of the following options:

Reteno system dashboard

  1. Go to MessagesMessages and click Create Email.
  2. On the main page, click the plus icon → New messageEmail.
  3. On the main page, in Messages click EmailCreate Email.
Dashboard homepage with the Contacts menu item, the plus icon, and the Messages Email option numbered

Step 2. Choose a Template

Choose a template from one of the categories:

Select a message template dialog with the Gallery tab open showing a grid of template thumbnails
  • Basic: nineteen ready templates, one empty and one HTML template.
  • Gallery: 350+ ready templates grouped by industry.
  • Saved: emails you have saved as a template. You can save any email as a template and further use it for similar campaigns with the same layout and design.
Email editor showing a webinar template with the Save button and Save as template option highlighted

You can edit any template in Messages and Saved Templates by

  1. clicking its name,
  2. clicking Edit on the right,
  3. also, you can click Copy to copy and edit the chosen template.
Messages list with a message name, the edit icon, and the copy icon numbered

Step 3. Create an Email Design

In our drag-and-drop editor, you can edit one of our ready templates, insert the code of your template and further edit it if needed, or create a custom HTML template from scratch. The main advantage of a visual editor is the built-in block responsiveness so that your emails will be displayed correctly on different devices.

The main tools of the editor are organized in three sections: two tabs (Appearance/Content) on the left and a settings menu in the upper right toolbar.

Email editor with the Appearance and Content tabs and the top toolbar icons highlighted

Appearance

This tab includes 5 subtabs:

  • General Settings;
  • Stripes;
  • Headings;
  • Button;
  • Mobile Formatting.

It allows to design a whole layout of your email, or its separate elements (header, content, footer, info area). The subtab Mobile Formatting enables to adjust settings that regulate the mobile display of the email.

Appearance tab Mobile Formatting subtab with font size, heading, button size, and content margin settings

Content

This tab includes 3 subtabs:

  • Structures;
  • Blocks;
  • Modules.

1. Structures
This section allows to add a structure to the template horizontally. Drag any structure to the necessary stripe and add the necessary blocks.

Email editor Content tab Structures list with a stripe structure highlighted, pointing to the Structure and Block labels added to the canvas

When you add to one structure several elements vertically (for example, text and images), they make containers which you can also set separately.

Email editor with the Container label highlighted around a speaker photo and name grouped vertically

To start editing any element (stripe, structure, block, container), click it.

2. Blocks
The section contains the following blocks:

Content tab Blocks list showing Image, Text, Button, Spacer, Video, Social, Banner, Timer, Menu, HTML, Carousel, Accordion, and Form blocks

You can add them by dragging from the menu, copy, delete, edit, and move them relative to other blocks. Each block is responsive by default. If needed, you can disable the responsiveness of images and hide some blocks when displayed on mobile devices.

3. Modules
This section contains two tabs (Advanced/My modules) with ready structures with built-in ready blocks and containers.

Advanced contains ready module templates:

  • Preheaders;
  • Headers;
  • Banners;
  • Info Modules;
  • Product Cards;
  • Footers;
  • AMP Sandbox.

My modules contains the modules you have previously saved. You can save any container, structure or stripe as a module, and they will be saved to this tab.

Content tab Modules section with the My modules and Advanced tabs, and a saved webinar banner module arrowed

A click on a specific email element automatically opens the settings on the left. And when you hover over it, you see a panel with the main actions you can apply to this element: save as a module, move, copy, and delete.

Email editor with a hover panel showing delete, copy, move, and save-as-module icons highlighted next to a content block

Additional editor features include:

  • Multilanguage;
  • Smart blocks;
  • Dynamic content;
  • AMP-supported elements (accordion, carousel, form);
  • Synchronized modules;
  • Custom fonts, etc.

Each element of your email template can be edited in the HTML editor as well. To open or exit the HTML editor, click Code editor in the top settings. You can open the editor for a particular element by first clicking it and then clicking Code editor. For convenience, the HTML and CSS editing tabs are separated.

Email editor toolbar with the Code editor icon highlighted, opening the HTML code panel below the canvas

If you create a message in HTML, insert your code into the HTML editing window. Emails can often contain styles within HTML in the <head> tag but some email clients may not support them. You can also add your own HTML and CSS block by dragging the corresponding block from the left.

Content tab Blocks list with the HTML block, pointing to an Insert your HTML in the Code editor placeholder in the email

Step 4. Preview and Test

To see how your email would look like on computer and mobile, click View message in the top toolbar.

Email editor toolbar with the View message icon highlighted

To test the message before launch, click Test and enter the email address or addresses to send to, and click Send.

Send test message dialog with an email address entered and the Test icon highlighted in the editor toolbar

We also recommend testing your email in special services. This is especially important when using custom designs or transferring the HTML code to the editor.

Reteno customers who apply for a free custom email template also receive additional testing of template display on all devices.

Step 5. Save the Message

Once editing has been completed, click Save. Choose Save as template if you want to use the created message as a template for further campaigns.

Email editor with the Save button dropdown open showing the Save as template option highlighted

The email will appear in the general list of messages or saved templates, depending on how you saved it.

Messages list with the newly saved Webinar message underlined at the top of the list
📘

Note

The editor saves your changes automatically as a draft. If you close the message without saving, the next time you open it you will see a notification that the message has a draft that can be restored at any moment — click Restore now to apply the unsaved changes, or dismiss the notification to keep the last saved version.

Your email message is ready. Before the launch, check your contact base and make sure you have your digital signatures configured


Did this page help you?