How to Upload an Email Template in Omnisend

In this tutorial, we’ll create a custom HTML email template in Omnisend using a template designed in Postcards.

Prerequisites

A Designmodo account
An Omnisend account
A Postcards template ready to export
Optional: a text editor that can open HTML files

Steps

1. Add the Omnisend unsubscribe tag to your Postcards template

Before exporting the template from Postcards, we’ll add Omnisend’s unsubscribe merge tag so the unsubscribe link can be styled and positioned directly inside your email design.

Omnisend uses personalization variables with double square brackets, including the unsubscribe link variable: [[unsubscribe_link]] .

If you don’t add an unsubscribe link to your template, Omnisend will automatically add its own unsubscribe footer. Adding the tag in Postcards gives you more control over where the unsubscribe link appears and how it looks.

You can add this tag in two ways:

As plain text inside a text element
As a link added to custom text, for example, “Unsubscribe”

In this example, we’ll add [[unsubscribe_link]] as a link to the text “Unsubscribe” in the footer.

Open your template in Postcards and go to your footer, or to the area where you want to place the unsubscribe link.

Select the text you want to use for the unsubscribe link. For example, select the word Unsubscribe and click the link icon above the text:

Add this as the link URL: [[unsubscribe_link]] and save the link.

Now, when the email is sent from Omnisend, Omnisend will replace [[unsubscribe_link]] with the recipient’s real unsubscribe link. You can also paste [[unsubscribe_link]] directly as simple text inside a text element, but linking it to custom text usually looks cleaner in the final email.

You can also add optional Omnisend personalization variables inside your Postcards template.

For example, we’ll use this variable: [[contact.first_name|default: "there"]] . If Omnisend can’t find the contact’s first name, it will show the fallback text “there” instead.

To add this variable, simply insert it inside a text element wherever you need it. In this example, we’ll paste [[contact.first_name|default: "there"]] inside the header.

When the campaign is sent, Omnisend will replace the variable with the recipient’s first name, or with the fallback text if the first name is not available.

You can find more Omnisend personalization variables here: https://support.omnisend.com/en/articles/1061845-personalization-in-channels

Now your template is ready for export.

2. Export your template from Postcards

Omnisend lets you import a custom HTML template in two ways: by pasting the HTML code or by uploading an HTML file. Because of that, you have two export options in Postcards.

The quickest option is to copy the email code directly from Postcards.

In Postcards, click Export in the top-right corner and click Copy Email Code.

Your full email template code will be copied to your clipboard.
You can paste this code into Omnisend later when importing the template.

The second option is to download the template as a ZIP file.

In Postcards, click Export in the top-right corner and click Download as ZIP.

Make sure Host images/fonts online is turned on and click Download.

A ZIP file will download to your computer, go ahead and extract the ZIP file index.html into a folder.

Inside the extracted folder, find the index.html file. This is the file you’ll upload to Omnisend later.

Using Host images/fonts online is important because Omnisend needs image files to use full online URLs, not local image paths from your computer.

3. Import your template into Omnisend

With your template exported from Postcards, the last thing to do is bring it into Omnisend. From your Omnisend dashboard, head to Store settings in the left-hand panel.

Once inside, look for Saved templates in the settings menu and click on it.

From there, click Import template.

You'll be asked to give your template a name and choose how you'd like to upload it, you can either upload your index.html file directly (up to 1 MB), or paste your HTML code if you used the Export → Copy Email Code option in Postcards.

In this example, we'll paste the code directly. In this example, we'll paste the code directly. Simply paste the code you copied from Export → Copy Email Code into the Paste template HTML field and click Import.

Once you paste or upload your code and click Import, Omnisend will save it and bring you back to your Saved templates page, where your new template will appear listed. You can click Preview on the template card to check how it looks before using it.

To use it in a campaign, head to Campaigns in the left-hand panel and click Create email campaign.

Fill in your campaign details and settings, then click Choose Email Template in the bottom right.

On the next screen, select the Saved Templates tab and click Use template on the template you uploaded.

Omnisend will open it in its editor, where you can make some adjustments, keep in mind that not all editing features will be available for custom HTML templates.

One thing to watch for: Omnisend automatically adds some padding to the Layout, which can affect your design's spacing. To fix this, click anywhere in the canvas and then select the layout tab in the right panel, scroll down to the padding section, and remove the left and right padding. You can also adjust or remove the top and bottom padding as needed.

When you're ready, you can click Preview and test to see how the email looks

And here you can send yourself a test email.

Once everything looks good, click Save, choose your recipients, and your campaign is ready to go.

What we covered

How to add Omnisend's unsubscribe tag and personalization variables to your Postcards template.
How to export your Postcards template as a ZIP file or by copying the email code.
How to import a custom HTML template into Omnisend via Saved templates.
How to use your saved template in an email campaign.
How to fix automatic padding in Omnisend's editor to preserve your design.