Template overview

Making your template editable can be done either by tagging your code with CSS classes and HTML attributes, or by using the visual template editor that will add the tags to your code for you.

Purposeful constraints

Tags that you add generate inline editing options in the Blocks Edit visual editor. Only the specific settings you add will be shown. This ensures the overall design and code remains intact and follows brand guidelines. And it keeps the editing for your team simple to interact with, without having too many unnecessary options.

Modular method

Blocks Edit follows design and development best practices and standard modular hierarchy. Sections are containers of content stacked on top of each other and make up a template's layout. Components, like headlines and buttons, are stand-alone pieces that can be used among content within sections. And content consists of text and images that can be edited inline.

Template setup

A template is a single HTML file that has all of your email design's components. Editable tags and attributes will need to be added to the code, but they work around it so you can code the design any way you like and continue updating and reviewing your template even after adding tags in.

This also means placeholder content should be included as editable tags are to be added on HTML elements around the content itself. This allows for showing examples of how the design should be used.


You can either import a standalone HTML file, or a ZIP file with any image assets part of your template. Your ZIP file will need to have your HTML file and images at the root level, with no folders. Images will be included with each exported email, along with any other added images that may have been uploaded while editing.

Preview mode

Try out a template's features after import without having to create emails. Click on the edit icon () next to the title of your template from the dashboard to go into template preview and editing mode.

Email portions

You can import just a portion of an email for editing. This may be helpful if you have a current email provider that uses a master template and locks in the header and footer for example, and you just want to work with a particular module. Or, if you want to provide your team with templated email signatures to use.

Template updates

When template updates are made, changes do not get applied to current emails, only new ones. By default, each email associates the specific template version that was available at the time the email was created. This ensures that potential design changes don’t affect an email as it’s being built.

However, there is an option to apply a template update and essentially upgrade to the latest version, if needed. At the top of an email an update icon () will be shown that will update the HTML code while keeping the content intact.

In order for this to work, and for the option to be shown, every editable content element requires having a variable name set. As should sections, components, and regions as well. Both in the updated version, and the version of the template for the email.

Layouts and pins also need to be updated separately from the email since they also use the template version of when they are saved, separately from when the email is created. Layouts and pins will have an update icon at the top in the left sidebar. Applying the updates means all emails will use the updated versions.

If layouts and pins don’t meet the requirements for being updated, you will see a warning icon () next to the layouts and pins that the update can’t be applied to and have to be rebuilt manually.

How code is handled

We take great care not to modify the code that you import into Blocks Edit. Here is how your template code is handled as you build emails from it:

Note: while in edit mode, certain browser plugins may make changes to your code that get saved with it. If you have any plugins that visually affect the email or interface, make sure to disable the plugin while editing.


You can use email provider tokens/tags/variables (ex: {{FirstName}}) throughout your template and emails as you normally would and they will be read by your ESP when exporting your emails to it.

This includes using tokens in text, links, and images as you build and edit emails in the visual editor. Note that images may appear to be broken if a token is used for an image's path.


Still have questions? Message us.