Marketo email templates your whole team can edit.

Elements: the regions a marketer can edit

An element is a region that opens for editing in the classic editor. It needs the class, an id and a mktoName, which is the label marketers see. Whatever sits inside the tag is the default content.

• mktoText is a rich text region, and the recommended way to mark text. The older mktEditable class still works, using the id as its label unless you add a mktoName.
• mktoImg is an image. On a <div>around the image the marketer can also set a link; on the<img> tag itself they can't.
• mktoSnippet is a region that takes one of your approved snippets. mktoDefaultSnippetId picks the one shown by default, and the region can't be switched to rich text.
• mktoVideo is a region where the marketer pastes a YouTube or Vimeo URL, shown as a thumbnail with a play button.

<div class="mktoText" id="headline" mktoName="Headline">
  The autumn edit is here
</div>
<div class="mktoImg" id="heroImage" mktoName="Hero image"
     mktoImgLink="https://northwind.co.uk/autumn">
  <a><img src="autumn-edit-jacket.jpg" alt=""></a>
</div>

Variables: one value, used across the template

A variable is declared once with a <meta> tag in the<head> and used anywhere in the template as${id}. Marketers change the value, so a variable is how a template offers a choice, such as a button colour or a font size, without opening the code. Inside a module, mktoModuleScope decides whether each copy of the module gets its own value or every copy shares one.

• mktoString: text. allowHTML lets it carry markup.
• mktoList: a dropdown of the comma-separatedvalues, with the first as the default.
• mktoNumber: a number, with min,max, step and units.
• mktoColor: a colour, with a six-digit hex default.
• mktoBoolean: an on-or-off choice, with the value to write for each state.
• mktoHTML: a block of HTML, such as a tracking pixel.
• mktoImg: an image URL. The same class as the image element, but declared with <meta>.

<head>
  <meta class="mktoColor" id="buttonColour"
        mktoName="Button colour" default="#2f5d3a">
  <meta class="mktoList" id="buttonAlign"
        mktoName="Button alignment" values="left,center">
</head>
…
<td bgcolor="${buttonColour}" align="${buttonAlign}">

Modules and containers: the sections a marketer can add

A module is a pre-built section, such as a hero or a product row, that a marketer inserts, duplicates or removes from an email. Modules live inside a container, and a template can have only one. In a <table>,<tbody>, <thead> or<tfoot> container a module is a<tr class="mktoModule">; in a <td>container it's a <table class="mktoModule">. Both need anid and a mktoName. mktoActive="false"keeps a module out of the list marketers can add from, andmktoAddByDefault puts it on the canvas of every new email.

<table class="mktoContainer" id="main">
  <tbody>
    <tr class="mktoModule" id="hero" mktoName="Hero"
        mktoAddByDefault="true">
      <td>…</td>
    </tr>
    <tr class="mktoModule" id="products"
        mktoName="Product row">
      <td>…</td>
    </tr>
  </tbody>
</table>

Rules worth knowing

• Class values such as mktoText are case sensitive. Attribute names such as mktoName aren't.
• Every id must be unique, with only letters, numbers, dashes and underscores.
• A container can hold only modules. Anything else inside it makes the template invalid.
• The syntax works in templates and emails, not inside snippets or rich text tokens.
• Changing a module in the template doesn't update emails already made from it.
• Marketo Support doesn't help with a template's HTML or CSS.

The Email Designer and the classic editor

Adobe's Email Designer is the newer, visual editor for Marketo Engage. It needs your subscription moved to Adobe's identity system, and Adobe says the classic editor will eventually be deprecated, with several months' notice and no date set. The two editors don't share templates. A template made in the Email Designer can only make Email Designer emails, and a classic template has to be imported before the Designer can use it.

Importing changes things. Imported HTML opens in Compatibility mode, where you can personalise text, add links and add assets, and nothing else until the HTML converter has turned it into the Designer's components. Classic variables aren't available at the email level, snippets aren't supported, nested blocks can't be selected, and the preview doesn't support custom HTML, so Adobe recommends testing with Send proof. Brand themes, which apply fonts, colours and logos across templates, are a Designer feature.

Sources: Adobe Experience League, Email Template Syntax, Email Designer overview, Email templates in the Email Designer, Template import, Email Editor v2.0 Overview.