The email builder
How the block editor works, plus a reference for every block.
The builder is a drag-and-drop editor. The left panel holds blocks and saved sections, the middle is your email, and the right inspector holds settings for whatever is selected.
How it works
- Drag a block from the left onto the canvas, or click it to append.
- Click any block to select it and edit its settings on the right.
- Drag blocks by their handle to reorder.
- Click outside any block to edit email-wide settings — background colour, content width, font.
Everything is saved as you work. There is no separate save button for content.
Block reference
| Block | What it does |
|---|---|
| Heading | A headline. Size, colour, alignment and font weight. |
| Text | A paragraph. Supports {{first_name}} and inline links. |
| Image | One image. Upload or paste a URL. Supports a link target, full-width mode and corner rounding. |
| Button | A call to action. Label, destination, colours, corner radius, width and alignment. |
| Divider | A horizontal rule. Thickness, colour and spacing. |
| Spacer | Vertical whitespace with an adjustable height. |
| Columns | Splits the row into two or three columns, each holding its own blocks. |
| Gallery | A grid of images. |
| Products | Real products from your connected store, with live prices. See Products in email. |
| Social | Row of social icons linking to your profiles. |
| Unsubscribe | The opt-out link. Every campaign needs one. |
Both calculate their own widths against the full content width, so nesting them inside a column would render at the wrong size. They are excluded from the column block on purpose.
Padding and regions
Every block has its own padding controls, so you can tighten or loosen spacing without spacer blocks. Blocks can also be assigned to the header or footer region, which is how shared headers and footers stay in sync.
Images
Uploaded images are stored by Nectazo and served from our own infrastructure, so they keep working even if your website goes down. Keep them under about 1 MB — email clients are slow to load large files and some recipients pay for data.
Always set alt text. Many people read email with images blocked by default, and alt text is all they see.
Designing for email, not the web
Email rendering is far more limited than a browser. A few things worth knowing:
- Keep the content width around 600px. Wider gets cut off in some clients.
- Do not rely on background images — Outlook frequently ignores them.
- Put important information in text, not inside an image, because images are often blocked.
- Test in more than one client. Gmail and Outlook render very differently.
Something unclear or wrong? Tell us and we'll fix it.