Hosting images for HTML email designs

By HTML Export

If you wish to export your design as HTML to send via a 3rd party service, you may need to host your images somewhere online. This ensures they will also be displayed in the email template after you have exported the design.

Step 1: Find our where to host your images

Many email service providers (ESPs) do not host the images in your email template for you. In this case, you need to host them yourself. This means all of your images need to be uploaded to a web-based location which is publicly available (i.e. your website or web server), so that your recipients can see them in the email.

The best way to identify this location is by consulting with your IT department or whoever is responsible for running your website. They will help you figure out where you can host your images, give you the specific URL prefix you need to enter into Mail Designer 365, and show you how to upload all the image files.

Step 2: Export your Mail Designer 365 design

When you have finished designing your email template and are ready to export to your ESP, go to “Share” > “Website / HTML.”

Exporting a Mail Designer 365 template as a HTML file

In the export window, you will see the option “Prefix image URLs with:”. Here, as referenced in the previous step, you should enter the exact URL prefix given to you by the IT department.

After this, fill out the rest of the export fields and then click on “Export” to export your design as a HTML file.

Step 3: Upload images to your web server

Following export, you can proceed to upload your images to the location where they will be hosted from. Follow the URL prefix you entered into Mail Designer 365 and upload all of the images from the HTML export folder to that location.

If you have difficulty uploading files or require permission to access the server, an IT administrator or similar will be able to help.

Now, you can upload your email template to your chosen ESP. You will find a list of our export guides for individual email services here.

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Exporting to other email marketing tools

By HTML Export

Other Email Marketing Tools

There are dozens of email and newsletter services that support HTML emails. If your newsletter provider supports custom HTML templates with images, you may be able to export your design from Mail Designer 365 and import into your tool of choice.

Preparing your design for import

Depending on your service, you may need to import your design in one of the following ways:

‣ Create and upload a compressed zip archive containing all of the files you exported from Mail Designer 365

‣ Upload your HTML file and a separate zip file containing all of your images

‣ Copy & paste the contents of your HTML file and upload your images

‣ Upload all of the exported files individually

Getting help with other email marketing tools

This manual can only outline the basic steps required to upload a design to an email marketing tool. As every newsletter service works differently, you’ll need to consult the documentation provided by your email service provider to see if it is possible to import custom HTML templates and how they recommend you upload your design.

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Offering your email newsletter on the web

By HTML Export

You can upload the exported HTML and image files to a web host

This will allow your readers to open your message in their web browser. You can utilise this to give readers an alternative way to read your message. In fact, this is especially useful if the reader’s email application does not support advanced HTML messages.

To offer your newsletter on the web:

‣  Export your design as a website

Export your email design as html

‣  Upload the exported folder to a web server (via FTP, or tools offered by your host)

‣  Add a link to the web version of your newsletter in your email

 

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Exporting your design as a website

By HTML Export

HTML Export

Mail Designer 365 can export an HTML file containing your design. You can reuse your design with other services, or publish a copy as a webpage.

Once you have created your design, you can export it as a wesbite. This will allow you to do even more with your design:

  • Upload your design to third-party newsletter services
  • Offer readers with email programs that don’t support HTML the option to view your message as a webpage in their browser
  • Link to your newsletter directly from your website, for people that would like to see a newsletter before they subscribe

To export your design as a website

‣ Open your design

‣ Choose “Share” > “Website / HTML…” from the menu bar

Export your email design as html

‣ Choose a location to save your design

‣ Optional: Enter a custom name for the exported .html file

‣ Optional: If you plan on uploading your images to a separate web server, you can enter an absolute URL prefix for images:

HTML export settings in Mail Designer 365

Mail Designer 365 will create a folder containing the HTML file and images that make up your newsletter.

 

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text