Sections and Content Blocks

When building an email in the Email Editor, the layout is made up of two main elements: sections and content blocks.

Understanding the difference between them helps you build structured email layouts more efficiently.

Sections

A section defines the structure of part of the email layout. It acts as a container for content blocks and helps control how content is arranged inside the email.

In contact.center™, you can use sections to organize content into separate layout areas, such as headers, body content, calls to action, and footer content.

You can add sections to your design in several ways:

  • Create your own section Drag and drop content blocks directly into the email canvas to automatically create a new section.

  • Use a pre-designed section Go to Content > Sections to choose from ready-to-use layouts that include images, text, and columns you can customize. To learn more about pre-made sections, see Use Pre-designed Sections.

  • Save and reuse your own section Reuse sections you created earlier by saving them beforehand. This is useful for recurring layouts such as headers, footers, or product showcases. To learn more about saved sections and reusable components, see Save sections for reuse in your email designs.

Sections highlighted inside the Email Editor layout.

Fig. 1. Sections in the Email Editor.

Customize Sections

Once you’ve added a section, you can customize its layout and style by selecting the section or row in the canvas to open its settings in the left panel.

Selecting a section to open its settings in the left panel.

Fig. 2. Open section settings from the canvas.

These settings help you control how content is arranged and displayed in your email:

Setting

Description

Columns

Choose how many columns the section uses and adjust the row structure for side-by-side content.

Spacing

Manage the space around the section to improve readability and keep the layout balanced.

Background

Apply background styling to help sections stand out or blend into the rest of the design.

Borders

Adjust border styling and corner rounding to refine the look of the section container.

Section FAQs

These common questions cover the section-level actions you are most likely to use while building and adjusting your email layout.

Add or Delete a Column

After you add content to the canvas, you can select the section or row and use the available Columns controls to adjust the layout.

Once you’ve added a content block within the email canvas, you can add columns by clicking the section and using the + controls in the section settings. You can also delete a column by selecting it and using the trash icon.

Using section controls to add or delete a column.

Fig. 3. Add or delete a column in a section.

Duplicate or Move a Section

To duplicate a section, select it and click the duplicate icon. You can then move the section by selecting and dragging it to the desired location. Alternatively, you can use the move icon or the up and down controls to move the section one position higher or lower in the layout.

Duplicating or moving a section in the email canvas.

Fig. 4. Duplicate or move a section in the canvas.

Check Where a Content Block Will Be Added

When you drag a content block into the canvas, the placement indicator shows where the block will be inserted.

If the highlighted insertion area spans the full width of the canvas, the block will be added as a new section. If the insertion line appears inside an existing row or column, the block will be inserted within that section.

You can also click the section or row in the canvas to confirm which blocks belong to that part of the layout.

Placement indicator showing whether a block will be inserted in a section or as a new section.

Fig. 5. Check whether a content block will be inserted inside a section or as a new section.

Use Stack on Mobile

To control how columns appear on mobile, select the section and switch to mobile view from the top bar. In the left panel, use the Stack on mobile toggle to choose how the columns behave on smaller screens.

When Stack on mobile is enabled, the columns stack vertically. When it is disabled, the columns remain side by side in mobile view.

Stack on mobile setting for section columns.

Fig. 6. Adjust mobile column behavior for a section.

Add a Divider

To add a visual separator, insert a Divider block between content blocks inside a section.

The divider helps break up content areas and makes longer layouts easier to scan.

Divider block inserted to separate content inside a section.

Fig. 7. Add a divider block to visually separate content inside a section.

Content Blocks

A content block is a specific type of content that you add inside the email layout.

Content blocks are used to build the actual content of the email. Each block is designed for a particular purpose, such as displaying text, images, links, or footer information.

Available content blocks shown in the Email Editor.

Fig. 8. Content blocks in the Email Editor.

You can find the available blocks in Content > Blocks and drag them into the email canvas.

The available content blocks are:

Image

The Image block lets you add visuals to your email, such as banners, logos, product images, and other graphics.

You can configure alternate text, replace the image, insert an image from a URL, adjust layout and spacing, and add links with tracking options.

To learn more about the Image content block, see Add and Edit Images.

Social

The Social block lets you add linked social media icons to your email layout.

You can use it to place branded social links in the header, body, or footer, and adjust icon appearance, layout, background, spacing, and borders.

To learn more about the Social content block, see Add Social Media Icons.

Spacer

The Spacer block adds vertical spacing between content elements in your email.

You can use it to improve readability, create cleaner separation between blocks, and give the layout a more balanced visual rhythm.

Navigation

The Navigation block lets you add a menu with links to key pages or sections.

You can use it near the top of the email to help recipients quickly navigate to important content.

To learn more about the Navigation content block, see Add Navigation Links.

Divider

The Divider block adds a horizontal visual separator between parts of the email.

You can use it to break up longer content, distinguish sections, and make the layout easier to scan.

To learn more about the Divider content block, see How can I visually separate content with a break line?.

Button

The Button block helps you create a clear call to action in your email.

You can configure the destination link, tooltip, tracking, layout, spacing, text styling, background, and borders to make the action stand out.

To learn more about the Button content block, see Add a Button.

Text

The Text block lets you add written content such as headings, paragraphs, short notices, and supporting details.

You can adjust its layout, background, spacing, and text styling to match the rest of your email design.

To learn more about the Text content block, see Insert a Text Content Block.

Wrapper

The Wrapper block groups content inside a shared container.

You can use it when several elements should share the same visual treatment, such as common spacing, background, or borders.

Hero

The Hero block creates a prominent feature area, typically near the top of the email.

You can use it to highlight the main message with strong visual emphasis, such as a large image, supporting text, or a call to action.

Footer

The Footer block lets you add closing content to your email, such as sender details, company information, unsubscribe-related content, and other footer elements.

You can place and style footer content directly in the editor layout so the end of the email stays consistent with the rest of the design.

Customize Content Blocks

When you select a content block in the canvas, the settings panel opens and shows the available options for that block.

Each content block has its own settings. To learn more about each content block and their settings, open the corresponding accordion in the list of available content block above to access their dedicated articles.

Content block settings displayed in the left panel.

Fig. 9. Content block settings in the Email Editor.

Content Block FAQs

These questions focus on common content-block actions you may need after you start placing and rearranging content in the canvas.

Move a Content Blocks

To move a content block within a section or to another section, drag and drop it to the desired position in the canvas.

This lets you reorganize blocks inside the same section or place them into a different section as you refine the email layout.

Dragging a content block to a new position in the canvas.

Fig. 10. Move a content block within a section or to another section.

Create a Layout with Images and Text

To create a layout with images and text, drag the blocks you want into the email canvas and arrange them in the order you need.

You can place them in the same section or use multiple sections, then replace the placeholder text and images with your own content.

Creating an email layout with images, text, and a button.

Fig. 11. Create a layout with images, text, and a button.

What’s Next?