en:e_mail_builder

This is an old revision of the document!


How to create an email with the email builder?

The email builder is a template which offers you unlimited possibilities for designing a newsletter. With no programming skills at all, you can design your newsletter flexibly, while at the same time having access to various design templates. Even the templates can be completely changed, which is why it is easier to start with a template.

The E-Mail Builder offers a variety of options with regard to:

  • Configuration: Colors, frames, backgrounds, font sizes and much more
  • Elements: Header, editorial, table of contents, text / image elements, links, social media link.

Newly built e-mails can be saved as re-usable templates.

Create message

If you create a new message, select the template “E-Mail Builder”. Now you can choose from an existing template, in which styles and articles are already integrated, or you may create an empty mailing.

By clicking OK you created a new message with the email builder! Now you can edit the design and the content of the template. Click on “Edit message”.

Editor

The following actions are available in the editor:

  • Settings: The following storage options are available. Using these settings, developers of e-mail templates are able to control the behaviour of the e-mail editor (refer to “Config Tags” of article How do I develop email templates for promio.connect?).
    • Inline CSS: Option is selected by default. A CSS style sheet defined in the source code is transformed “inline” into the corresponding tags of the body. This can especially improve the display of the e-mail in e-mail clients that ignore CSS style sheets.
    • Ignore storage errors: Option is not selected by default. Before saving, errors in the source code, such as syntax errors, are shown.
    • Used CSS inliner: Choose CSS inliner to be used when the option “Inline CSS” is selected:
      • Default: Option is selected by default. This version can only transform CSS for single, non-comma-separated selectors.
      • Next Generation: This version does not underlie restrictions of “default version” and can inline CSS blocks with stacked or comma-separated selectors, e.g.
        .classname a {
            color: #000000;
        }
         
        .class1, class2 {
            padding: 10px;
        }
  • Reset changes: Reset changes that have not yet been saved.
  • Save: Save without closing the editor.
  • Save & exit: Save and go to the message details.

Further settings

The icons on the left side directly under the menu bar allow you to make the settings for the following functions:

  • Resolution: Yu can choose between fullscreen and diverse resolutions in landscape or portrait.
  • Hightlight editable elements: The editable values get marked yellow,
  • Show layout actions: Show/hide actions for inserting, copying, moving, deleting layouts,
  • Edit title: edit title (title-tag) in html format. Condition: title-Tag must be included in the underlying master template. Placeholders of the types field or function can be used.
  • Edit preheader: Here you can create and edit the preheader of your mailing,
  • Edit CSS: Configurate the design of your newsletter.

Add a new layout

You have created a new newsletter with the email builder.

With a click on the button add layout you can adjust design and contents to the template by selecting a category on the left side:

You can build your creative by combining different categories. If you move the mouse over the blocks, they will be displayed in yellow.
Now you can edit the selected area.

Edit a layout

In the editor, you can select templates, replace images, personalize, translate, expand, shorten or rewrite texts with the help of AI and much more.

You can also put a link behind a button. Enter the media browser via the three lines-button on the right to choose a pdf or picture file.

Using the image editor, you can insert, remove and link images in various ways.

Add link Link an image
Replace (Upload) Insert an image via drag & drop or upload from your computer
Replace (Media-Browser) Upload an image from the Media-Browser that was previously saved there
Replace (AI) Generate an image by entering a description
Remove image Remove an inserted image
Add entry to table of contents Add or remove the image from the table of contents

When it comes to the protection of data privacy the footer is the most important part of your email. Use a design template and then change all the data.

Make sure that your company information as well as the link to unsubscribe are included in every newsletter! You must not send an email without the reader’s option to unsubscribe!

Configuration

When you chose a template you can change different aspects of the layouts’ designs. Click on „Edit CSS“. Here you can edit the basic design of your email. Open up the sliders to edit font colors, size and so on. Go to Artikel > Text to define the look of your article text.

When your personal language setting is English the names of the CSS classes might still be in German and vice versa. This is because their names are hardcoded in the language the Master Template was programmed.

Textversion

Mailings that were constructed by using the email builder, get delivered as multipart and contain an automatically created test version. Click on „Text“ next to the button „HTML“ to have a look at the text version.

en/e_mail_builder.1740135018.txt.gz · Last modified: 2025/02/21 11:50 by bk