Email Builder

With Unlayer’s email builder, your users don't have to spend hours in a designer's office creating emails. They can just drag and drop! Once the email is designed, your users can use your application to send it to their audiences.

Our email editor gives you full control over the email design. It lets you customize every aspect of the email, from the layout to the content and images. Your users can use images, merge tags, and other elements to customize their email. They can also preview the email before sending, and export the HTML code for further editing.

You can explore our full template library.

Why Use Email Builders?

With a drag-n-drop email builder, users can create and select multiple email templates, change the content, include pictures, and link to files. Furthermore, they can name the template and change its structure and styling. Once your users select a template, they can customize the content by editing it in the editor. Rich template selection in email builders allows customizing the email to suit the audience and branding.

Our email builder also improves deliverability and ensures that the email looks great in all email clients, especially older ones such as Outlook.

Integration

After installing our JavaScript library, use the following code snippet to initiate the email editor. You have to pass displayMode as email, and replace your project id.

unlayer.init({
  id: 'editor-container',
  displayMode: 'email',
  projectId: 1234 // REPLACE
})

Editor In Action

Once the editor is initialized, it will look like this.

You can also initialize the editor in dark mode.

Tools for Email

The editor comes with the following tools out of the box.

• Columns: It allows your users to add columns to your design in order to have a better design arrangement.
• Button: Add any type of button in your email. You can change colors and styles.
• Divider: It gives your users appropriate spacing at any point they want in their design.
• Heading: Add headings (from level 1-6) to the design.
• HTML : This tool will give your users room to add custom HTML to the design.
• Image: To make your emails attractive, you can add images using this tool.
• Menu: Menu is a built-in tool used to create navigation menus.
• Social: It is a built-in tool that lets users add their social media icons to your design.
• Text: Text is a built-in tool so users can add text to their designs.
• Timer: Timer is used to create countdown timers. This tool creates a countdown GIF image to run a real time countdown.
• Video: It lets users add YouTube or Vimeo videos to their designs. This tool automatically generates thumbnails of videos for emails and ensures that it renders correctly on all platforms.

You can create custom tools to extend the functionality.