Choose your content type
-
In the email you just created, click Add email content.
-
The Create your email page loads. You can choose from a few options:
-
Design from scratch using the visual email editor
-
Import your own HTML via an HTML or zip file
-
Select an existing template (one of our samples or one you already saved)
Design from scratch
When starting from scratch in the email editor, use the options below to define your content.
-
In the Create your email page, select Design from scratch.
-
Add structure and content to your email.
-
Add images.
-
Personalize your content.
-
Review links and edit tracking.
Import HTML
You can import existing HTML content to design your email. The content can be:
-
An HTML file with an incorporated style sheet
-
A .zip file that includes an HTML file, the style sheet (.css) and images
-
In the Design your template page, select Import HTML.
-
Drag and drop the desired HTML or .zip file (or select a file from your computer) and click Import.
You can make desired changes to the imported content using the visual email editor tools.
Choose a template
There are two types of templates to choose from.
-
Sample templates: Marketo Engage offers four out-of-the-box email templates.
-
Saved templates: These are templates you created from scratch using the Templates menu, or an email you created and chose to save as a template.
Choose one of the out-of-the-box templates for a head start on your email template design.
-
The Sample templates tab is open by default.
-
Select the template you want to use.
-
Click Use this template.
-
Edit the content as desired using the visual content designer.
-
Click the Saved templates tab and select the desired template.
-
Click Use this template.
-
Edit the content as desired using the visual content designer.
Add structure and content
-
To start creating or modifying content, drag and drop an item from Structures onto the canvas. Edit its settings in the pane on the right.
TIP
Select the n:n column component to define the number of columns of your choice (between three and 10). You can also define the width of each column by moving the arrows below the column.NOTE
Each column size cannot be less than 10% of the total width of the structure component. Only empty columns can be removed. -
From the Contents section, drag over desired items and drop them into one or more structure components.
-
Each component can be customized via the Settings or Style tabs. Change the font, text style, margin, and more.
Add fragments
-
To access your fragments, select the Fragments icon (
-
Drag and drop any of the fragments into the structural component placeholder.
The editor renders the fragment within the section/element of the email structure. The content of the fragment is dynamically updated within the structure to show how the content appears in the email.
After the email is saved, it appears in the Used By tab of the fragment details page. Fragments added to an email template are not editable within the template; the source fragment defines the content.
Add Assets
Add images that are stored in the Images and Files section of your Marketo Engage instance.
-
To access your images, click the Asset selector icon.
-
Drag and drop the desired image into a structure component.
NOTE
To replace an existing image, select it, then click Select an asset in the Settings tab on the right.
Layers, settings, and styles
Open the navigation tree to access specific structures and their columns/components for more granular editing. To access, click the Navigation tree icon.
The example below outlines steps to adjust padding and vertical alignment inside a structure component composed of columns.
-
Select the column in the structure component directly in the canvas or using the Navigation tree displayed at the left.
-
From the column toolbar, click the Select a column tool and choose the one that you want to edit.
You can also select it from the structure tree. The editable parameters for that column are displayed in the Settings and Styles tabs on the right.
-
To edit the column properties, click the Styles tab on the right and change them according to your needs:
-
For Background, change the background color as needed.
Clear the check box for a transparent background. Enable the Background image setting to use an image as the background instead of a solid color.
-
For Alignment, select the Top, Middle, or Bottom icon.
-
For Padding, define the padding for all sides.
Select Different padding for each side if you want to adjust the padding. Click the Lock icon to break synchronization.
-
Expand the Advanced section to define inline styles for the column.
-
-
Repeat these steps as needed to adjust the alignment and padding for the other columns in the component.
-
Save your changes.
Personalize content
Tokens work in the new editor the same way they work in the old, but the icon looks different. The example below outlines adding a first name token with fallback text.
-
Select the text component. Place the cursor where you want the token to appear and click the Add personalization icon.
-
Click the desired token type.
-
Find the desired token and click the … icon (clicking the + icon instead adds a token with no fallback text).
NOTE
“Fallback text” is the new editor term for default value. Example:{{lead.First Name:default=Friend}}
. It is recommended in case there is no value for the person in the field you choose. -
Set your fallback text and click Add.
-
Click Save.
Edit URL tracking
Sometimes you don’t want to enable the Marketo Tracking URL on a link in an email. This is useful when the destination page does not support URL parameters and may result in a broken link.
-
Click the Links icon to display all URLs in your email.
-
Click the pencil icon to edit tracking for any desired links.
-
Click the Tracking Type drop-down and make your selection.
-
Optionally, you can give the URL a label or add Tags.
-
Click Save when done.
Check Alerts
As you design your content, alerts are displayed on the top-right of the screen when key settings are missing.
There are two types of alerts:
Warnings
Warnings refer to recommendations and best practices, such as:
- The opt-out link is not present in the email body: While unsubscribe links are a requirement, adding them to the body of your email is a best practice.
-
Text version of HTML is empty: You must define a text version of your email body for when HTML content cannot be displayed.
-
Empty link is present in email body: Verify all links in your email are correct.
-
Email size has exceeded the limit of 100KB: For optimal delivery, make sure the size of your email does not exceed 100KB.
Errors
Errors prevent you from sending or testing the email until they are resolved:
-
Subject line is missing: An email subject line is required.
-
Email version of the message is empty: This error occurs when the email content has not been configured.
Test your email
When your message content is defined, you can use test profiles to preview it, send proofs, and control how it renders in popular desktop, mobile, and web-based clients. If you inserted personalized content, you can check how it’s displayed in the message using test profile data.
To preview your email content, click Simulate content, then add a test profile to check your message using the test profile data.