This article provides an overview of the features and functions of Message Editor that you'll encounter as you create and edit messages and templates. Use this article to learn:
- what's where in the editor (e.g., the tabs of the Navigation bar) and
- what you can do with the options and settings menu in the toolbar.
See Message Editor Zones and Layouts to review the various building blocks (Zones, Layouts, Custom Zones) and to decide which are best suited for your message/template content. Each Zone is then detailed in a dedicated article to provide more focused guidance (instructions, tips) for creating messages and templates.
You can use Message Editor's drag-and-drop functionality and powerful editing tools to create and modify professional-quality email messages. With it, you can easily:
- add and remove columns,
- insert text blocks and images,
- set up dynamic content and RSS feed blocks,
- enable social sharing, and
- create color themes for use in other emails and templates.
The formatting tools make it easy to add borders and spacing, change font styles and colors, and update your message's overall color schemes, while a built-in image editor lets you edit your images directly in the editor without needing a third-party tool.
ACCESSIBILITY: Any time you're designing webpage or email-based content, it's more important than ever to keep modern accessibility principles in mind. Because this article touches on content design, we recommend referring to Best Practices - Accessibility and its associated resources.
Message Editor interface
Let's learn how to access Message Editor features and functions:
- Navigation bar - The left side has three tabs that enable you to create, test, and set some of the properties of your messages and templates, as described in Navigation bar, below.
- Canvas - This is where you add and position the building blocks (i.e., the various types of content) of your messages and templates, and where they display during editing.
- Tools & Settings - Above the canvas are various tools and settings: a menu to access the HTML, text, and mobile versions; buttons to undo and redo your actions; and a settings menu (gear icon) to save your changes or save your message as a template.
Navigation bar
The Navigation bar tabs are described below.
Menu tab
The Menu tab provides a number of helpful message options in three categories:
Preview
-
Preview - This option is mainly used to preview Dynamic Content. It allows you to preview each of a Dynamic Content block's associated Views.
See Message Editor Zone - Dynamic Content for more information.
-
Preview Personalization - Quickly preview any Personalized Fields you've added to your messages.
See Message Editor Zone - WYSIWYG to learn more about Personalized Fields.
Send
- Send Message to Individual - Send your message to one or more individuals. In cases where you want to ensure content displays properly in specific email clients, this is a great way to send a test email to one or more email addresses (this can be any of your addresses or those of a peer).
- Send Message to Group - Send your message to one or more recipient groups.
Manage
- Dynamic Content - This link doesn't function in the new Message Editor interface, as Dynamic Content is completely created and managed via Dynamic Content zones in the new interface. This link will be deprecated in the future.
-
Templates - Takes you to the Manage Templates page, where you can create, edit, and manage your message templates.
See Create a Template to learn more about templates.
Zones tab
The Zones tab is where you craft your messages. Here, you'll find pre-made Zones, Layouts, and Custom Zones, all of which are the main building blocks you'll use to build the structure and content of your messages. Think in terms of building a message out of Lego blocks: Each zone can be dragged-and-dropped onto the Canvas to create a new object for message layout, text, images, social sharing icons, and more.
You can create Custom Zones as well. These zones contain content that is custom or unique to your organization and used on a recurring basis. Custom Zones can be used to add static content, such as your organization's physical address and links to your social sites.
You can add the following Zone types:
- WYSIWYG
- Image
- Video
- RSS
- Article
- Dynamic Content
- Social Sharing
- Form Field (exclusive to creating Landing Page Campaigns)
- Numerous Layouts
- Custom Zones
See Message Editor Zones and Layouts for more detailed information about each zone type.
Design tab
This is where you can apply a number of color themes and styling options to your message, including general message options and zone-specific options.
When a zone isn't selected, you can:
- Select a pre-built theme or create your own to control the color of your content, columns, borders, and background.
See Color Themes to learn more about creating themes.
- Set a body background color using any color from your current theme. The body background color fills the entire area surrounding your message (it's the light blue color in the image above), and helps offset your main email message.
- Choose a default font for your message. Keep in mind this doesn't affect any text already in place, only new text you add.
When a zone is selected, additional options become available allowing you to modify it:
- From the Section Background Color menu, you can set a specific background color for your zone using any color from your current theme.
- In the Zone Styles area, you can:
- Apply a border around the zone, controlling both its width (in pixels) and color. For even more flexibility, check the Apply side-specific borders box to set a unique border for the top, bottom, left, and right border.
- Apply padding (in pixels) within the zone. For even more flexibility, check the Apply side-specific padding box to set unique padding for the top, bottom, left, and right edges of the zone.
Tools & settings
This section of the Message Editor provides a number of helpful message tools and settings, including:
Message Version menu
From this menu, you can edit and create the various versions of your message. For those knowledgeable with HTML code, you can also select Email Code to view your message as HTML for powerful and flexible message creation.
To make it as easy as possible to edit and format each version, a unique visual editor is shown for each type:
NOTE: Updates made to your message in the Email Designer and Email Code views are not automatically transferred to the Text and Mobile versions, and vice-versa. This is by intention, so you can optimize these versions for mobile and text-only recipients. However, as you're managing your messages over time, remember to keep your Text and Mobile versions up-to-date as well. You must do this by manually clicking the Refresh button to pull in the latest changes.
Email designer
This is the default view when creating a message, and the one where you'll likely do the bulk of your work. It's the only view providing access to the Zones and Design tabs.
Email code
This view enables you to view your message as HTML code. For those knowledgeable with HTML, this gives you even more power and control over the creation of your message, and is ideal for pasting in HTML code from another source.
Text version
This is the text-only version (all HTML is removed) of your message, which you can see and edit by selecting this view.
NOTE: This version is shown to recipients who opt to receive text-only emails (i.e., they use a text-based email client). While you're not required to create a text-only version, and can send your messages without one, these recipients will see a blank message if you don't.
While the text-only version of a message is not automatically created for you, any content you've added in the Email Designer or Email Code view can be added to the Text Version with the click of a button. Once your message is finalized, the best practice is to verify and reformat this version to fix any possible spacing, bullets, style issues that may not convert properly from the Email Designer and Email Code views.
To copy your content from the Email Designer/Email Code views:
- Select the Text Version view.
- Click the Refresh button at the top-right to copy in the content/latest changes.
Generally, you will:
- Create and finalize your message in the Email Designer.
- Refresh your Text and Mobile versions to copy all the content over.
- Make any necessary changes to those versions to optimize them.
Mobile web version
This is the version recipients will see if viewing your message on a mobile device. This feature allows you to easily create a version of your message that is optimized for mobile viewing (and see how it looks at any time for easy editing).
See Create Mobile Versions of Your Messages to learn how to create and manage your mobile version.
NOTE: Updates made to your message in the Email Designer and Email Code views are not automatically transferred to the Text and Mobile versions, and vice-versa. This is by intention, so you can optimize these versions for mobile and text-only recipients. However, as you're managing your messages over time, remember to keep your Text and Mobile versions up-to-date as well. You must do this by manually clicking the Refresh button to pull in the latest changes.
Generally, you will:
- Create and finalize your message in the Email Designer.
- Refresh your Text and Mobile versions to copy all the content over.
- Make any necessary changes to those versions to optimize them.
Undo/Redo buttons
- Undo - Click this to undo one or more previous actions you've made while creating your message. This is the best way to quickly and easily fix mistakes you've made or changes you don't want to keep.
- Redo - Similarly to Undo, click this to redo one or more previous actions you've made while creating your message.
NOTE: The Undo/Redo buttons are only available in the Email Designer view.
Settings menu
This menu provides access to the following options:
- Save Changes - As you're working on your message (in any view), the Message Editor automatically saves every action you perform. However, you can select this to manually save your work at any time to ensure your progress is saved.
NOTE: Updates made to your message in the Email Designer and Email Code views are not automatically transferred to the Text and Mobile versions, and vice-versa. This is by intention, so you can optimize these versions for mobile and text-only recipients. However, as you're managing your messages over time, remember to keep your Text and Mobile versions up-to-date as well. You must do this manually clicking the Refresh button to pull in the latest changes.
-
Save Message as Template - Select this to save any message you're working on as a template for future use.
See Create a Template for more information about templates.
Color themes
In the Design tab (only available in the Email Designer view), you can quickly change the various background colors of your message using various pre-built color themes. You also have the flexibility and control to create your own color themes to match the branding of your organization or any other look you may want.
See Color Themes to how to create, apply, and manage themes.
Permissions
A full range of permissions enable administrators to lock down the look and feel of messages and templates. End users can be granted or restricted permission to create templates, Custom Zones, color themes, and more.
- See Template Permissions to learn how to set access permissions for templates.
- See User Permissions to learn how to control a user's access to dozens of features and settings.