Below are some useful tips to bear in mind when creating your own template, or if you need to convert an old email or an old Emarsys template into a VCE template.
Converting an existing HTML email or Emarsys template should be a straightforward task for an experienced HTML developer. However, we do recommend that you let us do this for you to ensure the template works as expected. For more information, see Ordering an email template from Emarsys.
Get the frame right
When converting an existing email into an Emarsys template, the first step is to open the code of your template, cut out the style and cut out all the content. What remains is the frame. You should do the following to your frame:
- Remove the <style> tag and its content entirely and put the #style# placeholder there instead.
- Put the #body# placeholder in the place of the content.
- Remove Doctype from the HTML code, if it is there. Define the doctype with the dropdown on the Frame Editor tab. It must be HTML for HTML5 emails and XHTML for any older HTML versions.
- Remove the preheader from the HTML code if it is there. The template must not contain the preheader text, as you will be able to write one every time you create a new campaign (Email Basics tab, Preview text field).
Get the style right
Define your text formatting with CSS.
<p>.leadText,
.leadText a {
text-align: center;
font-size: 12px;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
}</p>
Blockify your content
The next step is to break its content into blocks. Not only is this an Emarsys compatibility requirement, but blockifying your content makes your templates much more flexible and opens up a lot of content strategy possibilities. You will be able to rearrange the contents of campaigns and add or remove blocks with ease.
Even the header and the footer of your content must be blocks; do not include them in the frame.
Every Content block should start with a block-level element, eg. <div>...</div> or <table>...</table> or <tr>...</tr>. It is the Email template validation engine that defines the required block-level element.
Include images
You have three options for including images:
- Emarsys can host the images for you. Just upload them into the Media Database.
- You can host them yourself and reference them by their URL.
- You can reference a third-party hosted image by URL.
In the latter two cases, you need to make sure that the images stay available through the entire lifetime of your campaigns.
Protect fixed content
Remember to use the e-editable attribute to define whether or not content can be edited in each campaign.
Use variables
If you know that there are elements common to all your emails then you should use variables. This will make it very easy for you to make universal changes and keep your design fresh and alive.
Check the template
The last step is making sure that your template looks good everywhere, from Outlook to Gmail.