Email Structure

To flexibly create emails that display correctly in all email clients (Gmail, Outlook, Apple Mail) and on different devices, the editor uses a four-level hierarchy: Stripe → Structure → Container → Block.

Stripes

Stripe is a top-level element that divides an email into horizontal sections and helps organize the main areas of the message:

• Header — the top part of the email with a logo or navigation;
• Content — the main area containing text, images, buttons, and other blocks;
• Footer — the bottom section with contact information, social media links, and legal details;
• Info area — placed above the header or below the footer and contains service links (for example, view in browser or unsubscribe links).

When a contact opens the view-in-browser link, the web version shows a service panel above the email. Its language follows the reader's browser language when a translation for that language exists, and English otherwise.

Add the view-in-browser link in the settings of a text or a button: in the list of link types, open the tab with the Special links group and choose View in browser. If you paste a copied address of the web version as a regular Site link instead, the contact opens a version where the dynamic content, product blocks among them, is not substituted. Do not shorten that address through an external service either: at send time the platform appends a key that identifies the recipient, so a link shortened in advance stops working.

The address of the web version appears only after the email has gone out in a bulk campaign — even one to a single contact — and not immediately after the campaign starts.

Structures

Structure is an element inside a Stripe that defines the number of containers in a horizontal row.
To add another structure, click the + icon and select the required configuration.

A structure can contain up to 11 containers in a row.

Containers

A Container groups content inside a Structure. You place blocks inside containers — for example, to create a feature card with an image, a short description, and a button.

In an empty container, you will see icons for adding basic blocks:

• image;
• text;
• button;
• spacer.

Element Settings

Stripes, Structures, and Containers share a unified set of tabs.

Settings Tab

This tab contains parameters that define the element’s behavior and the conditions for its display in the email. The available options may include both common settings (available for all elements) and element-specific ones, depending on the element type (Stripe, Structure, or Container).

Common settings:

• Padding (except for Stripe) — outer and inner spacing between structures and containers with blocks;
• Display Conditions — rules for showing or hiding the element after the email is sent;
• Include in — select the email version where the element appears (HTML, AMP HTML, or both);
• Hide element — hide the element in the desktop or mobile version of the email.

Specific settings:

• Stripe — configure the email area (Header, Content, Footer, or Info area);

• Structure — set the number of containers, their width, and the spacing between them.

Styles Tab

Data Tab

Use this tab to connect data sources and work with dynamic content (for example, data from a website).

Blocks

A Block is the smallest structural element of an email template. You place it inside a container, where it holds the content. Use a block to add text, images, buttons, videos, and other message elements.

The editor’s side panel contains all available blocks.

To add a block, drag it into a container.

Click the block to open its settings, grouped into the following tabs:

• Settings — define the block’s behavior and display conditions in the email: links, spacing, alignment, display conditions, and more.
• Styles — control the appearance: colors, background, borders, and other visual properties.

Let's look at the elements of the Blocks tab.

Image

Check out the possibilities of working with images in a separate article.

Text

The text block has a built-in editor that allows you to change the font, background color, indents, etc. In addition, the text generator using artificial intelligence is at your service.

Button

Check out the possibilities of working with buttons in a separate article.

Spacer

The spacer helps visually separate different content blocks. In the block settings, you can select the line type, color, adaptivity, etc.

Social Networks

Adds links to the brand’s social media pages — Facebook, Instagram, and others.

Block settings:

• Icon type – choose the display style of social media logos: colored or monochrome.
• Social networks list – add, disable, reorder, and enter links for Facebook, X, Instagram, YouTube, and others.
• Icon size – set the height and width of the icons in pixels.
• Space between icons – adjust the horizontal spacing between icons on large screens.
• Title and alt text – additional labels for accessibility and hover tooltips (can be enabled or disabled if needed).

Menu

The Menu block is placed in almost all emails. You can add it both in the header and in the footer. The menu is an easy way to add small CTAs if, for example, the user is not interested in the campaign offer but knows what they want to see on the site. Usually, the block from campaign to campaign stays the same.

There are 3 types of menus:

• links
• icons
• icons and links

HTML

The HTML block is intended for adding your own HTML and CSS code. Note that only the functions of editing pictures and links will be available from the entire adaptive editor. The user configures the adaptability independently.

Banner

Displays a large visual element for the main message of the email. Image editing tools are available, similar to those in the Image block.

Video

The block displays videos from external platforms such as YouTube, Vimeo, or Instagram. The email shows a preview image with a Play button that opens the video page. This helps attract attention and increase engagement, for example, for product reviews, promo videos, or branded content.

You can add a video link, configure alt text, use a custom preview image and choose the play button style. Set the preview size for desktop in the block settings.

Timer

More about creating a Timer >

AMP Blocks

AMP technology allows you to create emails that look like stand-alone web pages. The subscriber can perform an action directly in the email: browse a carousel of app features, answer a survey, book a session, etc. Instructions for setting up AMP elements:

• AMP Carousel
• AMP Accordion
• AMP Form

Navigation and Actions with Elements

To select an element, click it in the editor.

You can perform the following actions with any email element:

• save it as a module (except for Blocks);
• move it;
• duplicate it;
• delete it.

1. Hover over the three-dot icon next to the required element.

2. Select the appropriate option from the context menu.