How to Use the Email Builder and its In-line Editor

Getting Started with the In-line Editor

The Email Builder’s in-line editor is a powerful tool for creating and customizing email templates and campaign messages directly within the CRM. This WYSIWYG (What You See Is What You Get) editor allows you to format text, add images, and adjust styling while seeing the results in real time, making the email creation process fast and intuitive.

Navigating the Email Builder Interface

When you open the Email Builder, you’ll see a workspace divided into sections. On one side, you have the email canvas where you build your content. On the other, you’ll find settings and options for the elements you select.

Managing Text and Formatting

To edit text, simply click on any text block within your email. A formatting toolbar will appear, giving you access to various options:

• Change text style using headings (H1, H2, H3) or paragraph formats.
• Select from a range of supported fonts.
• Adjust text size from 8px to 96px.
• Apply colors using hex codes for precise matching.
• Use formatting like bold, italic, underline, and strikethrough.
• Insert or edit hyperlinks.

Using Advanced Editing Options

The editor also includes more advanced features for greater control:

• AI-Assisted Content: Generate engaging email copy quickly using the built-in AI tool.
• Custom Padding: Manage the spacing around your content. By default, padding is set to 12 pixels for top and bottom, and 24 pixels for left and right.
• Dynamic Content: Insert personalized fields, such as a contact’s first name, to tailor your message.

Managing Elements

You can add various elements to your email layout, such as images, buttons, and dividers. Click on an element to select it, then use the settings panel to adjust its properties, like alignment, link destination, or background color.

Adjusting Appearance and Styling

Mobile Formatting

It’s crucial to ensure your email looks good on mobile devices. The Email Builder provides a mobile view option. Click the mobile preview icon to see how your design adapts to smaller screens. You can adjust element sizes and text formatting specifically for mobile to maintain readability.

Email Mobile View Configuration

While in mobile view, you can make changes that only apply to the mobile version of your email. This allows you to optimize the layout for phone users without affecting the desktop display.

Best Practices

• Promotional Emails: Use bold colors, clear fonts, and a single-column layout for easy reading. Make your call-to-action button prominent.
• Newsletters: Opt for a multi-section layout to organize different types of content. Use a background color that complements your images.
• Re-engagement Campaigns: Personalize the message using dynamic fields. A single-column layout with warm colors can create a more personal feel.
• Abandoned Cart Emails: A two-column layout can show the abandoned items on one side and a reminder with a special offer on the other. Use dynamic content to automatically insert product details.
• Event Invitations: Keep the design clean with a single-column layout and a clear call-to-action. Consider adding a countdown timer for urgency.

How to Use the Preview in Browser Feature

Before sending your email, use the "Preview in Browser" option to see exactly how it will appear to recipients. This opens your email in a new browser tab, allowing you to check the formatting, links, and overall appearance outside of the editor.

By mastering the Email Builder’s in-line editor, you can create professional, effective emails that engage your audience and drive results.