Using the Email Editor
Design emails with the drag-and-drop editor
Using the Email Editor
The Mailnaptic email editor provides a visual drag-and-drop interface for designing professional emails without writing code. You can also switch to raw HTML mode for full control.
Editor Layout
- Content panel (left) — a palette of draggable content blocks: text, image, button, divider, spacer, social links, and custom HTML.
- Canvas (center) — the live preview of your email. Drag blocks from the content panel onto the canvas to add them. Click any block to edit it.
- Settings panel (right) — when a block is selected, its settings appear here: styling options, link URLs, alignment, padding, colors, and more.
Adding Content Blocks
- Drag a block type from the content panel onto the canvas.
- Drop it in the desired position. A blue insertion guide shows where the block will land.
- Click the block to select it, then edit its content and settings.
Available Block Types
- Text — rich text with formatting controls (bold, italic, links, lists, headings).
- Image — upload an image or enter a URL. Set alt text, link, and dimensions.
- Button — a call-to-action button with configurable text, URL, colors, border radius, and alignment.
- Divider — a horizontal line to separate content sections.
- Spacer — adjustable vertical spacing between blocks.
- Social links — icons linking to your social media profiles.
- HTML — a raw HTML block for custom code. Use this for advanced layouts or third-party embed codes.
Editing Blocks
- Move — drag a block to reorder it within the email.
- Duplicate — click the duplicate icon on a selected block to create a copy directly below it.
- Delete — click the trash icon on a selected block to remove it.
- Style — use the settings panel to adjust padding, background color, text color, font size, and more.
Global Styles
Click the Design tab in the settings panel (when no block is selected) to set global styles: email background color, content area width, default font family, and default text color. These apply to all blocks unless overridden at the block level.
Tips
- Keep your email width at 600px for best compatibility across email clients.
- Use web-safe fonts (Arial, Helvetica, Georgia, Times New Roman) for maximum rendering consistency.
- Always add alt text to images for accessibility and for recipients whose clients block images.
- Save frequently used block configurations to your content block library for reuse across campaigns.
- Test your design across clients using the Email Client Compatibility checker on the review step.