Adding a modulezone

Great job! So far youve added two modules and made a link, an image and some text editable.

Youll have noticed that when you viewed the email in the Taxi editor, the image and text module were already populated and you didnt need to add them manually, we also couldnt reorder them.

This could be useful for some modules, such as a logo or navigation module as they typically stay in the same place in every email.
However, in your Email Design System youll have all the modules you could possibly need for any of your emails so you can add them into the email as you need. This can be achieved using modulezones and is what well cover in this lesson.

Modulezones act as a way to split the modules in your EDS out depending on where they are typically used in an email, such as header, main body and footer. This ensures that modules that belong in the footer for example, cant be used in the header.

To add a modulezone to your EDS, directly above the first module add an opening <modulezone> tag and include a name and a label attribute. Then directly after your last module add a closing <modulezone> tag.

<modulezone name="main_content" label="Main Content Modules">
<module name="image_module" label="Full Width Image">
...
</module>
</modulezone>

All HTML that sits within a modulezone needs to be inside a module. If there is any HTML inside a modulezone but outside of a module, it will be removed from the EDS.

And now were ready to upload this to Taxi again. Head back to your account and upload or paste the HTML again.

If you dont have access to Taxi, heres a video showing how our modulezone will work.

In this example we added a main content moduezone, however if needed you can also add other modulezones to your HTML such as one for the footer or header.

Now were going to move onto adding in more control to our EDS by using fields.

Click here to continue.