QuickBooks HelpQuickBooksHelpIntuit

Import a Custom HTML Template

by Intuit Updated 3 months ago

If you want more control over your email design than our templates offer, you can code your own HTML template and import it to your Mailchimp account. After you import your custom template, you can use it for future campaigns.

In this article, you'll learn a few ways to import and edit your custom HTML template.

Before you start

Here are some things to know before you begin this process.

  • This is an advanced feature and is recommended for users familiar with custom coding. Contact your developer or hire a Mailchimp Expert if you need assistance.
  • Accounts on a Mailchimp Standard plan or higher can use custom HTML templates. To find out what features are included in each plan, check out our pricing page.
  • Before you create your own HTML template or hire a developer, consider other types of templates that don't require any HTML knowledge.
  • For code tips and best practices, learn about limitations of HTML in email design, and browse Mailchimp's Email Design Guide.
  • When you edit a code-your-own template in the Template Builder, your changes may affect existing draft campaigns that use the template.
  • We'll run your HTML through a validator service to make sure the syntax is correct.
  • Include the *|UNSUB|* tag in your custom template, which is required in all campaigns.
  • Make sure your HTML file's character encoding is UTF-8.
  • Format all images as JPG, JPEG, PNG, or GIF. Include any PDFs or other documents to host with Mailchimp that are linked in your template code.

Import options

After you or your developer code your template's HTML, you can import the template with one of these methods.

Paste in code

To create a custom template by pasting in your own HTML, follow these steps.

  1. Click Content, then click Email templates.

  2. Click Create Template.
    Cursor Click - Create Template

  3. Navigate to the Code your own options and choose Paste in code.
    button-codeyourown-pasteincode
  4. On the Edit Code tab, replace or edit the example code, and click Save in the editing pane.
    Cursor Click - Save - Import Custom HTML
  5. When you’ve finished editing your template, click Save and Exit.
    button-editcode-saveandexit
  6. In the Save Template pop-up modal, enter the name of your template and click Save.
    modal-savetemplate-clicksave

Nice job. You can find your new custom-coded template on the Templates page of your account.

Import HTML

To create a custom template by importing an HTML file from your computer, follow these steps.

  1. Click Content, then click Email templates.

  2. Click Create Template.
    Cursor Click - Create Template

  3. Navigate to the Code your own options and choose Import HTML.
    button-codeyourown-importhtml
  4. Click Browse and choose your HTML file.
  5. Name your template, and click Upload.
    modal-importhtml-clickupload
  6. Review your template and click Edit Code or Edit Design to make changes as needed.
    button-templateeditor-editcode
  7. When you’ve finished editing your template, click Save and Exit.
    button-editcode-saveandexit

Nice job. You can find your new custom-coded template on the Templates page of your account.

Import ZIP

There are a few requirements to review before you import your ZIP file.

  • Your ZIP file must be less than 1MB and contain only 1 HTML file. If you have more than one HTML file, we'll use the first one we find.
  • Place all images and files in the root directory of the ZIP file and not in subfolders. We'll upload all your images and files to the content studio and create absolute paths for you when we convert your ZIP.
  • Use only letters, numbers, and hyphens in the file name. Spaces or unusual characters can cause problems when you import.
  • The upload is case sensitive, so your code must match your file names exactly.

After your file is properly saved and formatted, you’re ready to create your template. To create a template by importing a ZIP file from your computer, follow these steps.

  1. Click Content, then click Email templates.

  2. Click Create Template.
    Cursor Click - Create Template

  3. Navigate to the Code your own options and choose Import zip.
    button-codeyourown-importzip
  4. Click Browse and choose your ZIP file.
  5. Name your template, and click Upload.
    modal-importzip-clickupload
  6. Review your template and click Edit Code or Edit Design to make changes as needed.
    button-templateeditor-editcode
  7. When you’ve finished editing your template, click Save and Exit.
    button-editcode-saveandexit

Nice job. You can find your new custom-coded template on the Templates page of your account.

Edit your custom template

After you import your custom template, you can modify it on the Edit Code pane of the template builder. If you used Mailchimp’s Template Language, you can also apply styles on the Edit Design tab.

button-templateeditor-editcode

When you’re ready to use your custom template in a campaign, you can add content and refine your design in the email builder. Any further changes made in the template builder may affect draft and ongoing campaigns that use the template.

More editing resources

Here are some more resources to help you edit your custom-coded template.

Use your template in an email

To use a saved custom-coded template for your email campaign, follow these steps.

  1. Click Content, then click Email templates.

  2. Click the drop-down next to the template you want to work with, and choose Create campaign.
    templates-dropdown-createcampaign

You can also find them under Saved Templates in the classic email builder.

Mailchimp

Sign in now for personalized help

See articles customized for your product and join our large community of QuickBooks users.

More like this