I want to change the grey around my white box to white. What do I need to change?
I already tried ->email-inline.scss
#background-table {
background-color: white;
}
-
You have say to which extend your question differs to existing material we have on site already in the same context. For example, what makes it different to Magento 1.9 - Change color or email templates? Next to that you take extremely care on a very specific detail, but most likely your question is not that specific. What is your current experience in editing Magento email templates? Which theme are you using for email-templates?– hakreJul 26, 2015 at 19:21
-
Often Yireo has good extensions in the context of magento email templating, they also have a tutorial here that might help: Customizing Magento email templates - I haven't read that tutorial, but I've been using the Email-Tester and Email-Override , the later I can suggest to you as I see you're doing translated email templates, is a nice-to-have with that.– hakreJul 26, 2015 at 19:28
-
Hello thanks for your comment. I'm using 1.9+ and rwd theme. I followed the steps but it didnt work for me. I think I'm gonna use some extension to solve this problem.– safdgtrtJul 26, 2015 at 19:59
-
First of all disable cache. And with RWD theme I think it uses some new stuff with the CSS part of templates. Technically you don't need an extension here. Just to make this chrystal clear.There is even an old-school way to test email-tempaltes, it's just that at work we've got that email-tester plugin and it's quite comfortable. E.g. see here: Magento: previewing/testing transactional emails with actual data, without actually sending them?– hakreJul 26, 2015 at 20:21
Add a comment
|
1 Answer
I have only recently discovered the new style emails and so far here's what I found
1) the emails arrive in my inbox with the following code at the top ("defanged" comes from my mail service)
<table style="border-collapse:collapse;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;margin-top:0px;margin-right:auto;margin-bottom:0px;margin-left:auto;background-color:rgb(235, 235, 235);font-size:14px;" id="defanged16-background-table" border="0" cellpadding="0" cellspacing="0" width="100%">
2) in the template header I only have
{{var non_inline_styles}}
and/or
{{inlinecss file="email-inline.css"}}
(pattern from the original templates cloned to make my own)
3) the styles in the email are built by emogrifier using the email css styles in the style build
for example my compiled email-inline.css contains
/* line 47, ../../scss/email-inline.scss */
body {
margin: 0;
padding: 0;
text-align: left;
color: #333333;
background-color: #ebebeb;
}
and
/* line 68, ../../scss/email-inline.scss */
body {
background: #ebebeb;
font-size: 12px;
margin: 0;
padding: 0;
}
as well as the background-table entry you found
Changing all three should work
if you are compiling from sass - changing the $c-email-background variable should do it
body {
margin: 0;
padding: 0;
text-align: left;
color: $c-gray;
background-color: $c-email-background;
}
body {
background: $c-email-background;
font-size: 12px;
margin: 0;
padding: 0;
}
html,
#background-table {
background-color: $c-email-background;
}
4) the docs I found are unclear whether the system will automatically use your email-inline.css and email-non-inline.css or whether you need to specifically ask for it
for inline it claims you need
{{inlinecss file="email-inline.css"}}
for non inline it claims it automatically takes it from 4 sources
