In Help, MailChimp Guide
MailChimp Setup Guide
Our email templates include a MailChimp version, which you can edit in their builder.
1 Folder Structure
Unzip the downloaded file to the local disk on your computer. The MailChimp-integrated files can be found in the
All Layouts/– all layouts folder and files.
images/– all images, Social, Icons, Placeholder
index.html/– index file of layout
zip-for-upload.zip– zip file for Mailchimp upload
All-in-One/– all modules are in one files
images/– all images, social, icons, Placeholder
index.html/– index file of layout
zip-for-upload.zip/– zip file for Mailchimp upload
grid/– standard grid examples
modules/– modules each in its own file
components/– buttons, navigation, footer, and spacers
2Uploading To MailChimp
/mailchimp/Select Your Layout/ folder, you’ll find the .zip file that you need to upload to MailChimp.
In MailChimp, go to
Templates -> Create Template -> Code your own.
Choose the “Import zip” option, name your template, and browse for the .zip file mentioned above.
Important: once the import is finished, you will be redirected to the Template edit screen, which shows a preview of your imported template. Do not try to use the “Design” view here, as this is not the place where you build your email layout for your campaign. Instead, as instructed in the video tutorial, just click “Save & Exit” on the bottom right of the screen.
Video Guide Uploading To MailChimp
We’ve made a video tutorial how to uploading our email templates in MailChimp. Please watch this first, as it covers the most common questions and issues:
The template has many customisation options through MailChimp’s interface, organised by section
These settings include:
- Change Background Colour
- Drag and Drop
- Edit Images
- Clone Edit Delete Modules
- Change Link Colour
- Change Text Colour
- Customize Link
- Customize Text
- Background image support – just click a background image to change it
Supported Template Tags
MailChimp Supported Template Tags
Important: Please note, MailChimp editor strips the width attribute from all editable images so if template contains any high definition (retina) images or icons, you must specify explicit dimensions for all such images in the MailChimp editor. All our templates contain retina icons and images. It is necessary if you upload the MailChimp version of template.
Video Guide Edit Template in MailChimp Editor
We’ve made a video tutorial how to editing our email templates in MailChimp default editor. Please watch this first, as it covers the most common questions and issues:
MailChimp’s Layouts feature
Our all-in-one template works with MailChimp’s “Layouts” feature (explained in the video).
Although needed for an all-in-one template, this feature isn’t recommended for cases where you need only a few modules in a template in MailChimp, with no other modules to choose from. This is a common case for freelancers that provide pre-built templates to their clients by building templates manually from the individual sections we provide.
If you’re a freelancer building ready-made layouts for your clients by using the base layout file and individual sections, we strongly advise removing the mc:variant=”…” tag from all sections that you use. This way, your client will only see the intended layout.
Limitations and Other Notes
Most visual email builders are limited in functionality, meaning they don’t or can’t allow fine-tuned control over the template as if you were to manually edit the HTML code. This is particularly important with MailChimp, so please take the following into account.
Conflicting Browser Plugins
The Grammarly browser plugin severely affects online email editors, including MailChimp. By injecting itself into the page, it corrupts email HTML, resulting in a broken template.
Important: Sometimes mailchimp have slow and clunky interface. It’s not our fault, and we are not responsible for this! If you have bugs, first of all try to reload browser page, you changes would be saved!
4Change Google Font
Web Font or Google font not support on some email clients. it’s important to keep in mind, that not all email clients offer universal support for web fonts. best practice to use web fonts.
Generally, the following email clients have good support for web fonts:
Android (default mail client, not Gmail app)
Outlook for Mac
Web Font Support In Email Clients
Video Guide Change Google Font
We’ve made a video tutorial how to change Google font our email templates in MailChimp. Please watch this first, as it covers the most common questions and issues:
5Outlook Background Images
MailChimp does not fill in the URL for the image in the
v:image src="..." from the VML code. You also need to do this manually, by editing the template HTML code.
Important: Setting a background image just with MailChimp’s visual editor does not update this code. Outlook will not show the correct image unless you manually edit the HTML.
Video Guide Setup Outlook
We’ve made a video tutorial how to setup outlook background images our email templates in MailChimp. Please watch this first, as it covers the most common questions and issues:
Still looking for an answer?
We're available 11:00 AM – 4:00 PM IST, Monday through Friday. We do our best to respondto each request with a personalized reply within 24-48 business hours.