Use rows in the email editor

In the email editor, every email is made of rows. A row is a horizontal band that splits the email from top to bottom. Each row has one to four columns, and blocks such as headings, text, images and buttons sit inside those columns.

The Layers panel on the left lists this order as Row › column › block.

Add a row

1. Click Rows on the left

   The panel has two groups: Empty rows and Pre-made rows. You can type what you need in Search rows.

2. Drag an empty row for a blank layout

   Drag a one, two, three or four-column row from Empty rows onto the email. A blue area saying Drop row here shows where it will land.

3. Click a pre-made row for a ready section

   Pre-made rows are grouped as Header, Text, Cover, Image and text, Products, Promotion, Event, App and Quote. A pre-made row you click goes at the end of the email, just above the footer, and is selected. To put it somewhere else, drag it between rows. Pre-made rows take their fonts and colours from Global settings.

Select, move and duplicate a row

Move the mouse just outside the row's left edge and click the Row tag that appears. The row gets a blue frame and a toolbar appears above it: Move up, Move down, Duplicate, Add to saved blocks and Delete. If GrafAI is on, the toolbar also has a GrafAI button. On the keyboard, ⌘D on a Mac or Ctrl+D on Windows duplicates the row, and Alt with the up or down arrow moves it.

Row settings

When a row is selected, the panel on the left shows its settings:

• Columns: number of columns, preset widths (such as half and half, or one third and two thirds), custom widths in per cent, Column gap, Space between items and Vertical alignment.
• Spacing: the space above, below and on both sides of the row. Use it to give sections room to breathe.
• Background: Row background, Content background and Background image. With Full width on, the background reaches both edges of the email.
• Corners and border: border width and colour, and corner radius.
• Column box: gives a column a background colour, corner radius and outer spacing to turn it into a card.
• Mobile: Stack on mobile, Reverse order on mobile, Hide on mobile and Hide on desktop.
• Show to: shows the row to everyone or only to contacts who match a condition. See Show email content by contact.

Adjust for mobile

Switch to Mobile in the top bar and the panel says You are editing for mobile. In this view, Spacing, Space between items and, on a stacked row, Column gap change mobile only; desktop stays as it is. A field with no mobile value uses the desktop value. Reset clears the mobile value.

When columns stack on mobile, Widths, Custom widths and Vertical alignment have no effect on mobile, so the mobile view hides them. If the columns don't stack, these fields show in the mobile view too and change desktop as well.