Lesson
Design Your Email Layout
Build Your Email Structure
You'll structure your email by creating a series of rows. Each row contains one or more columns. You will place editor blocks into these columns to add content to your email.
Rows
In the Email Drag & Drop Editor, rows represent the structure of the email content. A row is a horizontal container that contains columns. Columns are what ultimately are filled with content to create your email.
You can add or remove rows to adjust the structure of your email. The row selector gives you a choice of rows with different numbers and distributions of columns. You can always adjust a row later to add columns or change how they're laid out.
Columns
Each row can have one or more columns to split the content into smaller sections. Columns let you create multiple content areas side-by-side in your email.
A single column in a row can contain multiple blocks that will stack on top of one another.
Adding and Resizing Columns
Usually you'll choose a row with the right number of columns, but you can always insert more if needed. To add a column to an existing row:
- Step 1: Go to the row properties.
- Step 2: Scroll down to Customize Columns and select +Add New.
You can also change the size of each column by dragging the bars between columns. The size of the columns will always add up to a total of 12 units.
Column Style Settings
You can adjust column style settings for each, individual column. To change the background color of the column, adjust the padding, or add a border:
Step 1: Scroll down to the Row Properties section of the editing panel on the right-hand side of the Drag & Drop Editor.
Step 2: Click on the column you want to edit in the Customize Columns section.
Step 3: Adjust your column settings as desired.
Walkthrough
In the video below, the email designer adds borders to each individual column in the row.
The Column Background color setting will override all other background colors.