sendwithus / templates

Sendwithus Open Source Email Templates

Open Source Template Project

The Sendwithus Open Source Template Project is a collection of free email templates created and managed by the sendwithus team and community.

Anyone may contribute new themes and templates, or make impactful updates to the existing ones.

• Browse and Download Templates
• Learn More About The Open Source Template Project

Use with CSS Inliner

To achieve the best compatibility, use a css inliner like premailer.

License

All templates are licensed under the Apache 2.0 license. They are offered as is, free of charge to everyone.

Contributing

Pull requests are welcome. Whether you're submitting a brand new theme or tweaking the look and feel of an existing one, send it our way - we want to see it.

Don’t have a Github account? Send your template designs directly to us at [email protected] and we’ll feature them on our resources page.

Any contributions are made under the contribution terms of the Apache 2.0 license.

Notes

Some email platforms aren't compatible with @import statements. Simply switch the @import to an html <link> to fix. EG:

<!-- Desktop Outlook chokes on web font references and defaults to Times New Roman, so we force a safe fallback font. -->
    <!--[if mso]>
        <style>
            * {
                font-family: sans-serif !important;
            }
        </style>
    <![endif]-->

    <!-- All other clients get the webfont reference; some will render the font and others will silently fail to the fallbacks. More on that here: http://stylecampaign.com/blog/2015/02/webfont-support-in-email/ -->
    <!--[if !mso]><!-->
        <link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
    <!--<![endif]-->

templates's Issues

Skyline image not centered in Gmail

The large background image is not properly centered in the Gmail web app or on the Android app. This can be seen in Litmus.

Is there a way to correct this?

Button on Narrative Templates

Hi,

I am less than a novice at CSS... was hoping to grab & hack these templates to success for my usage.

I am trying to use the narrative templates and when sent to Google, etc it seems to work OK, but some of our customers are are not get an active button. Specifically the confirmation email.

We also use InfusionSoft, so when I just attached this email to the contact history as a 'sent mail', without actually sending the email body, the HTML tag is getting stripped out. I suspect that InfusionSoft is using some sort of Outlook engine under the hood.

When I remove the tag from wrapping an inner

it seems to work, but it does not look at nice.

It also looks like the urn:schemas-microsoft-com:office:word has been deprecated.

https://msdn.microsoft.com/en-us/library/ms875215(v=exchg.65).aspx

Since the "button" is contained by all the MSO stuff, I suspect his is the root cause.

Any Insights ?

Thanks in advance.

Tyler

Buttons look bad in Outlook / Windows 10 Mail

This is a screenshot from the Windows 10 Mail app:

(same issue in Outlook).

Gmail?

I'm using the Sunday/Invoice template, but it looks really bad in Gmail. Am I missing something or is this expected behavior?

Templates are useless

While I do understand how you can use them, my opinion is that these are useless templates for reason that you are using tables and content is in various tags, which is basically against the HTML guidelines. This makes it so hard to simply provide content, and run it in the template. It is HTML template, but not usable.

Zen-flat doesn't display correctly in Gmail web

Cannot find a CSS file at: http://fonts.googleapis.com/css?family=PT+Sans:400,700

Getting this error when pasting any of the go templates (e.g. welcome) in Mailchimp:

An error occurred parsing your template CSS:

Cannot find a CSS file at: http://fonts.googleapis.com/css?family=PT+Sans:400,700

Closing </tr> missing

Thanks for the great free templates!

I noticed there is a closing <\tr> tag missing in a number(maybe all?) of the oxygen templates.

For example:
https://raw.githubusercontent.com/sendwithus/templates/master/templates/oxygen/invite.html

there are 22 opening <tr>s but only 21 closing </tr>s

Gmail, responsive and fonts?

Have these templates, notably Oxygen, been updated to ensure support for the Gmail updates that allow for media queries?

Additionally, I'm having trouble finding recent news about Google Fonts being supported in gmail. Seen anything?

Oxygen template styling in Gmail in Chrome

I tried sending one of the confirmation templates to myself. It appears as if the borders are missing in Chrome. They look fine in other browsers and clients. I've attached an image below.

Doesn't work on Hotmail's Web

CSS doesn't load properly for Hotmail. The template is really very nice :)

Outlook chokes on <link> for webfonts

Regarding the mention of linking webfonts in the Notes section of the readme, Desktop Outlook (Windows) chokes on the <link> tag and defaults everything to Times New Roman. Have you experienced this?

Doing something like this can right the ship without using the @import tag.

<!-- Desktop Outlook chokes on web font references and defaults to Times New Roman, so we force a safe fallback font. -->
    <!--[if mso]>
        <style>
            * {
                font-family: sans-serif !important;
            }
        </style>
    <![endif]-->

    <!-- All other clients get the webfont reference; some will render the font and others will silently fail to the fallbacks. More on that here: http://stylecampaign.com/blog/2015/02/webfont-support-in-email/ -->
    <!--[if !mso]><!-->
        <link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
    <!--<![endif]-->

Example from Rob Berinti's TEDC15 talk - slide 46

A bigger intro about the Project

I think you should add a little bit more info on how to use this project, just a suggestion

Additional Icons

Is it possible to find additional social icons to add to the Oxygen templates? Maybe find the specific icon library or something that was used or something?

Oxygen Upsell and Ping missing TR tag

In both the Oxygen Upsell and Ping there appear to be missing TR elements around a TD element. The table content looks like this:

<table>
  <tr>...</tr>
  <tr>...</tr>
  <td>...</td>
</table>

The Welcome template appear to be correct however.

Hidden ULRs active Azure email phising filter

Line 21 to 24 in
https://github.com/sendwithus/templates/blob/master/templates/cerberus/responsive.html#L21C1-L22C1
triggers Azure to tag all emails with this in the body as phising:High Confidence.

I would strongly recommend remove hidden URL in the template.

Doesn't play nice with CSS inliners

These templates seem to work without inlining, but then all the non-inline styles are ignored by most common email clients. The Gmail web client does not look like the litmus screen shot.

To fix this, most people inline CSS from style blocks into the corresponding elements' style attribute. However, these templates don't work well when css is inlined. For example, after CSS is inlined on the zen-flat template the green call to action button is not clickable. This happens with two common css inline libraries.

Formatting errors with Oxygen on Google's Inbox client

Has anyone else noticed weird formatting issues with Google Inbox?

Here is the Oxygen theme w/ Inbox. Haven't done a lot of digging, just wondering if anyone has found a simple formatting fix?