How to use the custom HTML email editor

To use the custom HTML editor, enter your MailerLite dashboard and go to Create Campaign. Give it a name, and then click Next. Here, you’ll have a few different editors to choose from. Select Custom HTML editor

Now, you can opt to either: 

  • Paste in the code
  • Import it from a zip file
  • Import it from a URL

Once you have selected one of these, you’ll be directed to the HTML editor. Here, you can paste in your code, or import it via the Import HTML button. 

Once your code is imported, you’ll see it written out in the code editor on the right. Bear in mind that after copying and pasting multiple elements into your newsletter, you may need to clean up your code. To tidy it up, simply click the Beautify button under the Content tab. 

On the left, you’ll be able to see a preview of your campaign. Whenever you click on a section of the newsletter, you’ll be able to see the corresponding code highlighted in the editor on the right. And vice versa—if you click on a section of code, it will take you to the relevant section of the preview.

You can access your File Manager by clicking on the gray button in the bottom right corner. Here, you can upload and add images to your newsletter.

Under Settings, you can opt to automatically add preheaders, footers and CSS inline.

The Snippets section of the editor allows you to quickly add pre-written, reusable source codes—including variables and custom fields, and HTML snippets. This can be copied and pasted into your code and adapted accordingly. 

When editing your work, you can send yourself a test email to make sure these look right in your inbox, or check it via the preview mode. You can also copy the preview URL to view it in your browser. You can use the undo feature to restore previous versions, and under Actions, you can save your project as a template to use again later. 

Check out our article on how to use the custom HTML editor for more step-by-step tips!