Discuss Home · Bootstrapped Podcast · Scribbleton Personal Wiki · HelpSpot Customer Service Software · Thermostat NPS

Composing the simplest possible HTML mail in Mailchimp?


#1

Hi,

I’ve been using Mailchimp for my newsletter for a few weeks now.

I’d like to use it to send an email that looks like all of the regular emails I send from Gmail. I don’t need graphics or anything else, just a little HTML here and there (anchors, bold, and italics mostly).

The way I’ve done it so far is:

  1. Compose newsletter in Gmail
  2. Send newsletter from Gmail to the random-looking email address Mailchimp have assigned to my newsletter mailing list
  3. Check and tweak the received newsletter in Mailchimp Campaign wizard
  4. Send newsletter from Mailchimp

Can you recommend any other other ways to compose a simple looking email in Mailchimp (that isn’t plain text)? I’m concerned that perhaps the imported email won’t look right in some clients. Sadly none of Mailchimp’s templates or themes seem to be appropriate.

Thanks in advance,

Eliot


#2

Yeah, it’s lame that MailChimp doesn’t support a simple html text email out of the box.

You can code the raw html yourself, but I’m guessing that isn’t what you want. And that didn’t seem very appealing to me.

I didn’t see an easy way to get a really plain html email. You can get close by starting with the “Basic 1 column” template and delete most everything out of it. Then you can adjust the styles to be as plain as you need.

  • Create a new template and start with the “Basic 1 column” design.

  • In the designer, hover over each block in the template and click the trash can in the upper right to delete. I do this with the image, the top header, and the main body. The footer seems ok, so I keep that. Then you have an empty template that looks like this:

  • Drag and drop a text block from the right to the body (its the third content block in the picture). Compose and format the text as you like. In the little toolbar, the font controls are hidden by default, so click the triangle to show them. When you’re done with the text, click Save and Close to get the text editor out of the way.

  • Click the Design tab at the top-ish right. Click Page, and change the background color to white. Check the other sections (preheader, body, etc) and confirm the styles are as you like. Set the body text to black to really get the gmail feel :slight_smile:

  • Choose “Preview and Test” at the top right and enter preview mode. If this looks ok, send yourself a test email from the same menu.

Hope that helps,
Ryan

p.s. If you’re interested, I’ll be covering topics like this in my upcoming The Bootstrapper’s Guide to MailChimp.


#3

I think a “Code Your Own” template will be the best available option.

If you don’t want to hand-code the HTML in their editor, you could delete their boilerplate and copy or import the source (not the plain text output) from one of your Gmail-crafted templates as a start.


#4

Thanks for both suggestions @ryan and @perceptec. I’ll experiment with them over the next few newsletters and see how it goes.

I’ve signed up for the Bootstrappers Guide to Mailchimp book @ryan, good luck with it!


#5

Feel free to import my simple template and see if it works for you:
http://www.nptechweekly.com/2014-07-03.html

But I must say I’ve also had some trouble:

  1. my snippet doesn’t show up in Gmail
  2. something about my design triggers the MailChimp footer inclusion

Cheers,
Ryan


#6

Bro, your body tag’s open! (Never leave the house like that.)

I took a quick peek and it appears to have been commented out along with an old footer, so that’s probably the source of the issues you mentioned. The html tag needs a closer, too.


#7

If it’s possible, try Campaign Monitor. You can send plain text emails.


#8

In fact, </head>, </body>, and </html> are all unnecessary - modern minifiers (I used grunt-usemin in this case) strip them out. Could be that MailChimp’s parser is strict in this regard, I’ll check it out.


#9

If you want to have a really simple HTML mail in MailChimp, then you will need to use the Code Your Own feature. You can use simple HTML tags to mark up your content, and you’ll have a mail that looks like “normal” mails in Gmail.

I’ve written up a quick guide on how to do it, and included a screenshot of the resulting mail. I hope it is of some use!


#10

Your guide certainly is of use, thanks for sharing @glenscott.

After reading your guide I did some testing to see what HTML Gmail generates when using their web cilent formatting tools. I used the “Show original” option to view the raw email. I’m sharing the findings here in case its of interest:

  • The Gmail web client didn’t generate p tags. Instead of p tags, it used divs. Divs that look like paragraphs are separated by another div that contains only a br tag.
  • There are four sizes of text available in the formatting tools: “Huge”, “Large”, “Normal”, and “Small”. Text is formatted with one of:
  • font tag with a size="… (e.g. 6)" attribute or…
  • span tag with a style=“font-size:… (e.g. xx-large)” attribute.
  • Text color is set by wrapping with font tag and using the color="… (e.g. #ff0000)" attribute.
  • Each list item in ordered and unordered lists had a br tag before the closing li tag.
  • Text bolded using b tags (not strong tags)
  • Text italicized using i tags (not em tags)

At the same time, I sent this email from the Gmail web cilent to Mailchimp to see if they would alter the HTML at all when importing it into a campaign. The changes I noticed:

  • The fake-paragraph-separators changed from a div-wrapped br tag to div-wrapped nbsp character entity.
  • The br tag at the end of each list item was removed by Mailchimp.
  • Bold b tags replaced with strong tags
  • Italic i tags replaced with em tags
  • Mailchimp added the mandatory footer with unsubscribe links etc.

#11

If you are on a paid account Mailchimp account you can run an inbox inspection and it will show you what your email looks like on up to 10 email clients per test.

It’s powered by Litmus.com which gives a free 7 day trial.


#12

I know this is an older thread, but MailChimp just announced today that they have an easy to user answer for your question @eliotsykes. To quote their email:

“There is now a Simple Text theme. This theme appears like plain-text and sections can be dragged and dropped within the drag and drop editor”

Sounds like it would be a perfect fit for what you need. It’s honestly a very welcome addition to the theme fold since many people want to send out normal messages via mass means.

You can see more about it and their automation announcement here: http://us1.campaign-archive1.com/?u=754d9532d6fb8f7811ee5cb6d&id=4861609028&e=2a761b91ae


#13

Thanks @gavin. The Simple Text theme is a welcome addition. I just sent a test email and checked it in the Gmail app on an iPhone. Sadly the default styles produce text that’s a little too small for my taste/eyes. I expect this can be fixed with a little customization. It’s certainly better than some of the Mailchimp mails I receive that are fixed width.

Also it was good to see in that announcement you linked to that Mailchimp are offering Drip campaign automation.


#14

It’s great that MailChimp recognizes the need for a simple text template. But I also don’t find it simple enough. I really want that “gmail feel”. The process I used to create a simple template is shown in my article here.


#15

Great share! Thanks.

Also side-note be careful how you share the mailchimp campaign. It seems like anyone with access to that url could potentially unsubscribe you, or update your profile information.

:slight_smile:


#16

Thanks Ryan, Old post but it saved me a lot of time and really happy with our “traditional email” look for certain triggered emails.