While we do support importing MJML, we recommend using our editor to create your emails. It’s the easiest way to create beautiful emails that work across all email clients.

Overview

MJML

MJML is a markup language that helps you create responsive emails. It’s an established framework that helps you create beautiful emails that work across all email clients. You can read more about it at mjml.io

Figma (via the Emailify plugin)

Sometimes you just want that special touch to an email that only Figma can give you. We get it! That’s why we support a free plugin, Emailify, that helps you create a beautiful email in Figma then export it into Loops.

MJML

If you have your MJML ready, there is one step you need to complete before you can upload it into Loops…

Add an unsubscribe URL

In your email code, you have to insert an unsubscribe link. This keeps you compliant with email sending restrictions.

All you need to do is add a {unsubscribe_url} tag into your MJML. When the email is sent, we will insert a contact-specific URL into this tag, which the contact can click to unsubscribe.

<a href="{unsubscribe_url}">Unsubscribe</a>

Use Emailify to create MJML

Using Emailify, you can create well-designed emails inside Figma, then easily export them ready for Loops.

Download the free Emailify plugin for Figma and launch it.

Add blocks to your email

To build your email you can drag and drop pre-made blocks provided by Emailify.

Once added you can customize each block.

Loops will automatically download and host all of your email images so they can be reliably displayed to your audience. This feature results in an odd quirk that you should be aware of:

Any text in your email that matches the path to one of your images will be replaced with the new path provided by loops.

For example: img/myImage.jpg will be replaced with something like: https://something.com/lkjn98s08hbAF/img/lkwekHBlhk78kasj.jpg

For most situations this won’t be an issue, only text that exactly matches the path to one of your images will be replaced.

While creating your email, you need to include an unsubscribe link.

To do this manually, add a link with the URL {unsubscribe_url}.

Alternatively, Emailify contains a pre-made Loops footer. Click Footer, scroll down until you see the Loops logo and click.

You are then free to edit the text and design of the footer (just leave the link URL value as-is).

Export your email

When you’re ready to export, click on Export HTML in the top right.

Then in the dropdown select Loops, which will generate Loops-friendly MJML.

You can add a Subject and Preview text in this step, too.

When you’re ready, click the Export for Loops button and wait for the code to be generated.

To download your files click on the Download your .zip file button.

Upload into Loops

Once you have MJML with an unsubscribe link included, you can upload it into Loops.

Click the upload icon above the email editor.

If you exported from Emailify, open the ZIP you downloaded. Drag and drop the .zip file found inside the _zips (For upload to Loops.so) folder. Then click Upload.

If you have custom MJML, create a ZIP file and drag it into Loops.

Your email is now uploaded into Loops and can be sent out!