This article...
- Explains how sections define the structure of templates.
- Details how to add sections, configure columns, and adjust their proportions.
- Describes style properties (e.g., background color, borders, padding, and alignment options).
- Discusses how to "nest" sections within one another for a more sophisticated design.
- Clarifies how to delete sections and the impact on nested content.
Sections help you define the structure of your template. Similar to a table structure, sections help define the overall format of your message. You can drag and drop all layouts (including Message Content areas) into sections.
Add a section
From the Design > Build tab, expand the Structure category and drag and drop the Section block onto the canvas.
Section properties
There are two tabs that let you define section properties: Columns and Style.
Columns
Use the Columns tab to divide your section. You can select up to five columns, and set their proportions using the Column Dimensions slider.
Check the Stack Columns in Mobile Version box to let your columns render differently in the mobile version of you message. When checked, any columns you have orient vertically.
Style
| Property | Description |
|---|---|
| Use default background | By default, this section uses the color that has been set in the Template Background field on the Theme tab. Uncheck the box to open the color picker to select a different background color. |
| Border | By default, this section does not have a border. Check the Border box to automatically apply the following default border properties: solid, 1px, black (#000000), all sides. Or, you can set:
|
| Banner | Check the box to extend the section to the edges of the message body. |
| Padding | Accept the default of no padding or click the dropdown to set the amount of padding for the top, bottom, left, and/or right of this section. The selections are automatically applied. |
| Banded Background | Accept the Default option to keep the section within the message body. Click Banded to have the section extend to the edges of the page. |
| Vertical Align | Click the dropdown to set the vertical alignment (top, middle, or bottom). |
Nested sections
Unlike other layouts, you can nest sections within one another. To do so, simply drag one section into an already placed section. By nesting sections in this way, you can create sophisticated designs and take advantage of great flexibility.
Delete a section
To delete a section, click to select it on the canvas and then click the delete (trashcan) icon located at the top right.
NOTE: When you delete a section, you’ll also delete all layouts and content that are nested within it.