11

I need to design an HTML email template which is sent through email to my clients.

I know that for designing an 'html email template':

  • No css files should be linked, all styling should be inline to html.
  • All images should be referenced through online server url and should not be stored locally.

My question is: Can I use bootstrap in html for designing an HTML email without downloading it and linking as a css file locally?

Brr Switch
  • 974
  • 1
  • 9
  • 21
Ravi B.P
  • 143
  • 1
  • 1
  • 5
  • I'm afraid this question is out of rules. Anyway, you can use bootstrap for emails but only if you copy all styles (all that can be applied in emails) from bootstrap for each element and insert it inline. – voloshin Sep 14 '17 at 18:41
  • No, it's not possible! :) your breaking the rules. The only way to make your email template is to have it inline styles. :) – bellabelle Sep 15 '17 at 04:32
  • No, bootstrap is not made for email templates. there are many online tutorials to make email templates. – Anmol Sandal Sep 15 '17 at 09:29

3 Answers3

14

No. Bootstrap is a pre-defined framework containing properties for elements and classes which is used using external css entirely (with the properties for elements and classes being defined in an external file). Since external css can't be used to style e-mails, Bootstrap can't be used either.

One might say that they can copy the code from the Bootstrap.css file and paste it withing <style></style> tags but even that is internal css and e-mails don't allow that. E-mails only allow inline css. So, Bootstrap can't be used in e-mails, and hence not in e-mail templates.

Vyom Maitreya
  • 420
  • 4
  • 9
  • 4
    What do you mean by "internal css"? I have used class properites on email elements that is defined in the header section of the html. So its global to the content. Gmail obfuscates the class names so they dont clash with email client. But it does do global styling. – Peter Moore Dec 29 '21 at 22:05
11

I know this question is 3 years old but thought it worth mentioning for future reference that now, we got Bootstrap Email.

https://bootstrapemail.com/docs/introduction

iravinandan
  • 659
  • 6
  • 16
  • 1
    Yeh and i kinda think that when these guys were answering the question it was not possible to do but I have been defining Internal CSS like here https://www.w3schools.com/css/css_howto.asp for the last year and it works. – Peter Moore Dec 29 '21 at 22:13
  • This is ok, it actually just renders inline styles based on a bootstrap layout. It's actually pretty damn good – Ian Jowett Jan 31 '23 at 12:23
4

You could use it theoretically, as long as you have some process that inlines styles (if you care about Outlook users), and as long as you only use HTML/CSS that is supported by the majority of email clients.

That being said, there are frameworks specifically created for HTML emails, like the very popular MJML or Foundation for Emails.

If you want to use a CSS framework to create HTML emails, I built Maizzle which uses the Tailwind CSS framework.

Cosmin
  • 269
  • 3
  • 8