Opening the editor
In the campaign builder, the Design step is where you choose a starting point; picking one opens the editor on the next step, Content. The same editor opens when you create or edit an email template, and when you configure an Email step inside an email automation. It is a full drag-and-drop canvas.
Adding blocks
The blocks panel lists all available content blocks. Drag any block onto the canvas to add it. The block names stay in English in every language:
- 1 Section — a full-width section container. Drop other blocks inside.
- 1/2 Section — a 50/50 split section.
- 1/3 Section — a three-column section, each column a third wide.
- 3/7 Section — a two-column section with a narrow left column and a wider right column.
- Button — a call-to-action button with a link. Customize the label, URL, color, and padding.
- Divider — a horizontal rule to visually separate sections.
- Text — a rich-text block for a single line or paragraph. Click to edit inline with bold, italic, links, and alignment options.
- Text Section — a combined heading + paragraph block, useful as a quick starting point for a new section.
- Image — click to upload an image or enter a URL. Always set alt text for accessibility and spam-filter friendliness.
- Quote — a pull-quote block for highlighted excerpts.
- Link — an inline text link.
- Link Block — a whole block that acts as one clickable link, so you can wrap an image or a layout in it.
- Grid Items — two components side-by-side in a row.
- List Items — a list of two stacked components.
Editing block content
Click any block on the canvas to select it. A contextual toolbar appears for that block type — use it to change text, set link URLs, adjust alignment, and change colors. The style panel shows detailed styling properties for the selected block, including padding, background color, and font settings.
To reorder blocks, drag them by their handle to a new position in the canvas.
Using merge tags for personalization
A reference panel below the canvas lists every available tag, grouped into Basic Fields, Custom Fields and Reserved variables. Type tags directly into a Text or Text Section block — for example, {{name}} or {{company}}. Common tags:
{{name}}— the subscriber's name{{email}}— the subscriber's email address{{unsubscribeURL}}— the one-click unsubscribe link (added to the footer automatically if you don't place it yourself)- Any custom field tags you've created — e.g.
{{plan}},{{company}}
Merge tags also work in the subject line and preheader — type them into those inputs the same way. The dashboard keeps showing the raw tag; the real value is filled in for each recipient when the email is sent.
If a subscriber has no value stored for a tag, the tag is left visible in the sent email — {{name}} arrives as literal {{name}}. To avoid that, add a fallback after a pipe inside the tag: {{name|there}} sends "there" whenever the name is missing or empty. An empty fallback ({{name|}}) leaves the spot blank instead.
Multi-column layouts
Drag a 1/2 Section, 1/3 Section or 3/7 Section from the block list onto the canvas, then drop other blocks (image, text, button) into each column slot. The column count and width ratio are pre-set per section variant — pick the variant that matches the layout you need rather than configuring columns on a single block. Column layouts collapse to single-column automatically on mobile-width email clients.
Preview desktop, tablet, and mobile
The editor's top bar has device buttons for desktop, tablet and mobile widths. Switch between them to confirm the layout looks correct at all three before sending, and use the preview toggle beside them to hide the editing outlines and see the email the way a recipient will.
Override with raw HTML
Two toolbar buttons give you direct HTML access, both backed by a Monaco code editor in a modal:
- Code → Import code — paste in a complete HTML document (e.g. a handcrafted template or an MJML-compiled output). Click Apply to wipe the canvas and replace it with the imported HTML, or Cancel to discard.
- Code → Edit code — loads the current email's HTML for tweaking. Apply writes your changes back to the canvas; Cancel discards them.
Both flows fully re-render the visual canvas from the HTML you supply. Custom inline styles may be partially normalized when returning to the visual editor.
The toolbar groups these under Code. A Content menu sits next to it with Load content (drop in a saved template or a recent email — it always replaces everything currently in the editor, so you confirm first) and Save as template (the whole email becomes a new template, its content kept as starter content). Alongside them are the Send test mail icon and the Generate with AI button — see the next section.
Generate with AI
The Generate with AI button opens the AI dialog. It works with templates: a template is a full email with one Content area (the dashed zone on the canvas); everything outside it stays exactly as designed.
- Change this email or write a new one — shown when the canvas has content. Change this email works from what is already on the canvas ("shorten the intro", "make the button green") and rewrites the whole of what the AI may touch, so wording you did not mention can come back slightly reworded; Write a new email replaces the content instead.
- Keep the template — this is a switch in the toolbar next to the button, not an option inside the dialog. On (the default) the AI writes only inside the Content area and your header, footer and colors stay untouched; off, it may redesign the whole email. It appears only when the email has a Content area, and in the template editor it reads Keep the frame.
- What the email should say — or what should change. Below it you can reuse the text of previous emails.
- Options — allow
{{variable}}merge tags, and add 1–3 AI images with optional extra instructions for them (each generated image is billed from your AI credits). The AI never writes the subject line or preview text — those stay yours. - Generate — the result goes straight onto the canvas. Undo in the toast brings the previous content back; to adjust the result, open the AI again with Change this email.
An email started from a template keeps that template's frame around the Content area, and the toolbar shows the template's name. Everything is editable, frame included — changes stay in this email only, the saved template never changes. When the AI writes new content into a template it keeps everything outside the Content area exactly; ask it for a header change while Keep the template is on and it does the rest of your request, then tells you the frame could not be changed — switch it off to let the AI edit the header too. The blocks panel starts with Styled blocks — headings, paragraphs, buttons and cards already in the email's colors and fonts — followed by the editor's Basic blocks.
To create templates and set the default one, see Email templates — save and reuse.
Generate a single image
You don't need the full AI dialog just to get one picture. Double-click any image on the canvas and the image library opens with Generate an image with AI at the top: describe the picture you need, choose Wide, Landscape or Square, and click Generate. It's added to your images like an upload and placed on the picture you were editing. Each generated image is billed from your AI credits.
A check before you save
When you finish an email, Yaplet scans the subject, preview text and body for phrasing that can hurt your delivery. If it finds any, a dialog lists the phrases and offers to rewrite just those with AI, let you fix them yourself, or continue anyway — nothing is ever blocked. See Spam phrases that hurt delivery.
Saving your work
In the template editor, click Save. In the campaign builder, click Next: Review and schedule to save and move on. Yaplet warns you if you try to navigate away with unsaved changes.
What's next
When your design is ready, schedule or send your campaign from the Review and schedule step. To reuse the design in future sends, save it as an email template.