Howdy,

Is it me, or none of the responsive templates (bar base_boxed_basic_query.html) stay responsive upon being fed in Beaker?

Thanks

I'm having trouble with 'transactional_tabular.html'. The border-bottom is not visible in Outlook 2010, see attached image.

I would really appreciate some help with the matter.

P.S. Keep up the good work with the templates!

Hi all,

I have been stuck on this issue for a long time.
I made an email in Sketch and exported it with Launchpad by Anima app, Once I upload the html zip file in Mailchimp, I only see the "alt" text and don't see the template at all, only some text.
Now, I figured it was because my images were saved on my desktop and not on the content manager of mailchimp, so I uploaded them on the content manager, but do I have to manually and the link to each image/asset next to the src"" to the content manager link? Or is there another easier way?
Also the links don't work, when I click on some words or images you are supposed to be linked to a website, for some reason this also doesn't work.
I attached the html zip file
AnimaPackage-Web-03Eks.zip

Any help/advice would be great.

Thanks!

What is responsive on the responsive templates?
If I open one of the responsive templates and resize my screen nothing ist adapt if I get smaller than the normal width.

Cheers

If you want your email to render better in gmail, you should not use < style >. Nor should you include anything important in the body tag, in terms of styling. (I don't mean within the body close body tags.)

So you should parse these templates into two parts, the css and then the html file. Then, head to Emogrifier. You put in each part (the HTML part and the CSS part) and they concatenate it into an HTML template that works in those email clients that tend to strip out style data.

http://www.pelagodesign.com/sidecar/emogrifier/

Hi!
So I'm trying to get one line of text in the header to stay on one line when viewed on mobile devices, I've tried everything but just can't get it to stay on the one line.
Anyone able to help me?

I used the following code:

Hi,

Thanks for the open-source HTML email template, I am a bit confused as to why the blueprint template is using table as columns, for me - it just doesn't work and somehow doesn't make any sense in terms of natural structure for html table formatting.

I'm guessing I might be wrong, please can anyone provide any technical reason behind this, I have changed it for td and it works perfectly for me but I would still need to know.

Thanks in advance.
Shina

Are the templates only supposed to be responsive for web based email clients? My template is responsive in the preview section but when I send I test the .leftcontent and .rightcontent td's (of the 2 col responsive template) do not float underneath. I am viewing them on the Gmail app for Android and the Apple Mail app for iPhone.

Basically it seems like there is zero responsiveness on the actual email. I didn't even change any of the css in the template.

The modular template currently has a max-width: 480px media query that triggers the mobile (one column) layout. However, the large (multi column) layout is based on a 600 pixel wide table. In practice, this means that any screen between 480 and 620 (600 plus scrollbar) pixels wide has horizontal scrolling. I could easily fix this by settings the media query to max-width: 620px, but I was wondering if there is a specific reason it currently works the way it does.

Hi, i am playing with this template and its great in thunderbird and gmail (in firefox) but just comes out as a texty-cody-mess in hotmail (firefox). Anyone know why?

I was looking the templates and found out that in every one which has "repeatable" blocks, each kind of repeatable blocks are isolated.
I mean, which one has his own table as you can see in this example from "2col-1-2-leftsidebar.html"

<td valign="top" width="180" class="leftColumnContent">
<!-- // Begin Module: Top Image with Content \\ -->
    <table border="0" cellpadding="20" cellspacing="0" width="100%">
        <tr mc:repeatable>...
        </tr>
     </table>
 <!-- // End Module: Top Image with Content \\ -->
 </td>
 <td valign="top" width="180" class="rightColumnContent">
  <!-- // Begin Module: Top Image with Content \\ -->
      <table border="0" cellpadding="20" cellspacing="0" width="100%">
           <tr mc:repeatable>...

So I can replicate columns but I can't exchange positions between left and right columns.

Thats is ok but I tried to implement an modular template where I'm able to replicate distincts modules (rows) and exchange their positions as you can see above.

Each row (color) is a different module.

When I try to use the Design editor, sending a campaign, I'm able to replicate my modules, edit and change their positions with different kind of modules.

But when I go to the Preview and Test function, everything go back to their original position.

Closing the Preview and Test I get back to the modified look but the email which arrives at my mailbox has the wrong feeling.

I searched for any material about Mailchimp's Design tool limitations but was not able to find anything. So I supposed if I'm able to change positions between distincts modules using Design tool, It should send my campaign with the same look.

So my question is, is this a bug or a limitation? And how would be the best way to achieve this functionality, creating different looks with different modules. Maybe replicating all content and hiding what I dont need?

Thanks in advance.

I created a responsive template for an email newsletter and we wanted to use 2x/retina images. It looked great on all platforms except for Outlook, where it would retain its full dimensions. It took a while to realize that having mc:edit on the img tag was the problem, and moving mc:edit to the containing td or div fixed the issue. While for our needs, the issue is fixed, I bring it up because having the mc:edit on the img tag gives different options in the Mailchimp in-browser editor that our team preferred. If it could be possible to allow for mc:edit to be used on the img tag without retaining the original dimensions, that would be ideal.

When transactional_tabular.html is rendered in Gmail the button styling for the template button (and other styling) is stripped/removed.

Gmail does not end up liking this:

<tr>
                                                        <td align="center" valign="top" style="padding-top:0;">
                                                            <table border="0" cellpadding="15" cellspacing="0" class="templateButton">
                                                                <tr>
                                                                    <td valign="middle" class="templateButtonContent">
                                                                        <div>
                                                                            <a href="http://www.mandrill.com/" target="_blank">See What Mandrill Can Do</a>
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </td>
                                                    </tr>

Hey fcarneiro,

we are a Startup from Germany and I have a question regarding the terms of use of your email templates.

I would preciate it if you can mail me your email address to discuss that issue.

My email adress is: [email protected]

I am looking forward to hearing from you!

Regards
Tobi

Hi,

Firstly thanks a mill - these templates have been very useful. I'm using base_boxed_body_image_2column_query responsive template.

I'm having an issue with the repeatable sections/rows, when adding a repeatable section in MailChimp and sending a test, the containing

In web dev, we have to contend with IE, now in emailing we have to struggle with Outlook... Dam you MS!

Thanks in advance.

I am using the code that you provided and it works great on my iPhone and when I click the view in browser link. However, when viewing the email in Gmail there appears to be no CSS styling at all.

Trying to use you guys templates (simple-letter-head-rightlogo.html) for one of our project. The html found on github renders perfectly in Chrome but when I receive the email in Gmail, most of the CSS is gone.

That seems very unlikely that you guys do not test Gmail, so I am probably missing out on something. Any idea?

Outlook 2016 doesn't set the width of the email to the 600px width set for the templatecontainer, it always stretches to approx. 750 px.

I can't seem to find any license in the README or in the project. What is it licensed as? MIT? BSD? CC? You may want to include it.

Thanks :)

Hello Guys,

this is really a good staff here, but far not up to date. Please check the blueprints in Gmail and make the corrections. And keep up the good work. :) Thanks.

G.

If you use for example simple-basic.html and send a test to Outlook 2007 without editing the template at all you will get a 1px padded white space around the header image that you don't get in Gmail or a modern web browser.

This seems to fix the problem: table td {border-collapse: collapse;}

Reference article: http://www.ianhoar.com/2008/04/29/outlook-2007-borders-and-1px-padding-on-table-cells/

I guess first question is, are you attempting to support squirrelmail?

If so, it seems to mostly work, but minus backgrounds and some text styling.

While it's a minor market compared to hotmail or AOL, it is still widely bundled with many hosting "control panel" setups.

I need to show the post image in RSS campaign in mailchimp. Please tell me the way I can show image in |RECENT| shortcode of the mailchimp. Also need the href link of the post.

It says "http://eepml". Not sure what's the right one though.

Hi guys,

I'm a UX Designer who's been fumbling his way through an email template for my company. Your template is working great across all clients except for Outlook 2010 on Mac running Windows (works fine running Mac OS).

Unfortunately this is the setup of my CEO, so have no choice but to get it working!

I'm new to GitHub so couldn't think of a better way to share my code:

http://stevedunnuk.com/misc/Outlook2010_WindowsForMac.rtf

I'm well and truly flummoxed with this one, so appreciate any help I can get!

Steve

Fatal error: Call to a member function toHtml() on a non-object in /srv/users/serverpilot/apps/magento/public/app/design/adminhtml/default/default/template/mzax/emarketing/filter/test/single.phtml on line 34

Is it possible to support Right to Left Languages such as Hebrew and Arabic ?

There is not style displayed in gmail (background, border, button ...)

The media queries in the responsive templates break in Yahoo Mail.

See this post: http://www.emailonacid.com/blog/details/C13/stop_yahoo_mail_from_rendering_your_media_queries

I don't know if that is the best fix... but something needs to be done.

The templates are licensed under CC-BY-SA-3.0 (see #2).

What does this imply for how they can be used?

Attribution is easy, I guess, just include a link to this Github repo in an HTML comment in every email you send out.

But ShareAlike? Do we have to publish any derived templates as well? Troublesome, but doable, as long as this only applies to the templates itself, and not the content management system that uses them.

When viewing these in my iOS simulator in the Safari app, I use MAMP to view them to test responsiveness, it shows as a normal website would show without the following meta tag:

When I add the above in to the template and run it via the simulator again (in safari), it shows as expected; responsive and full width in portrait and landscape.

Is this missing on purpose and should I be testing them directly in the Mail app? If so, how does one test these in the mail app or do I have to test them via mail chimp?

Hi ,
Working with base_boxed_3column_query.html.

I've imported into mail chimp to be an editable template.

When adding a new image, I upload a file of 480px width yet it just resizes to 160px and enlarges this image so it pixellates.

Hi,

We have an issue when we use the transactional_tabular.html template with Outlook (2007 and 2010). After the cell concerning "the tabular part", cellpadding concerning the last message and the button cells are ignored.

You can see this problem in my screenshot. I simply sent this template without editing it :
https://github.com/mailchimp/email-blueprints/blob/master/templates/transactional_tabular.html

Did anyone have a workaround ? I tried to search one, but I really don't understand why this bug occur.
Thanks!

I was reading this: so what do I need to do? check or uncheck for AUtomatic CSS ininer if I want it to remain responsive?

Many thanks

Responsive Templates & CSS Inlining

When inlining the CSS in the responsive templates, be sure not to include the styles within the media query; they should remain in the of the email. MailChimp inlines the CSS correctly, but many services may not.

Currently the best way I can see how these look would be to

1. open PHP or some other tool that allows me to send raw HTML emails
2. paste in one of these examples
3. send
4. receive and
5. look at it

Please include some screenshots (maybe automatically with a gh-pages) so that steps 1-4 are not necessary.

I took a raw code of a MailChimp template from GitHub. i am not able to open the link of the page.