6

I am trying to add inline CSS in the email template in my custom module. Example

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, width=device-width" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <style type="text/css">
        {{var template_styles|raw}}

        {{css file="css/email.css"}}
    </style>
</head>

I reviewed some other modules in Magento 2 for reference like Ebizmarts but no one adds CSS file in the email template he just written all CSS code in the email template instead of adding a new file.
I am not sure what is an issue. Looking for help...

1 Answer 1

2

Well, the main reason you didn't find anyone adding a link to CSS file in the template is explained in the official documentation: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/templates/template-email.html#email-styles

Some email clients (for example, Gmail) support only CSS styles that have been applied as “inline” styles on the style attribute of HTML tags. Because of this, the majority of email styles are applied as inline styles.

Thus, if you want to be sure your email is compatible with every email clients, I suggest you add inline CSS directly in the template instead of adding a link to a CSS file. Feel free to check out the official documentation for more details.

4
  • i create module so write inline css not good idea i open isue on magento 2 git hub forum regarding this issue thax. Commented Sep 1, 2016 at 8:58
  • @Pratik well it's not a Magento issue right ? It is the email clients like Gmail which don't support non inline CSS. I highly doubt you want your emails to be unreadable by Gmail right ? Commented Sep 1, 2016 at 9:00
  • this is not email client issue if i put same css in theme folder its fallback and it's working but when i put in my cusom module and calling in email template it's not apply. git hub issue link for magento 2 github.com/magento/magento2/issues/4438 Commented Sep 1, 2016 at 9:13
  • @Pratik the issue you send me has been closed, you won't get any answers there. Feel free to open a new one Commented Sep 1, 2016 at 9:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.