Hello,
I have been digging and racking my brain for 3 days. It used to work perfectly with my previous design but now I can't find a way to have my design displayed.
I use Thunderbird and I manage a hotmail, a gmail and my own domain name accounts as well as a french one. Now it doesn't show the same thing everywhere. I also checked directly with the emails clients and this is sometimes worse.
Hotmail shows only the text. My french account shows most of the design css and html. But some css is not showing (for example, the banner or the links colors).
When I set up the css following the basic coding, I get it perfectly in the admin welcome mail (I use chrome), I also get everything in my preview.
Then I thought maybe my emails account and/or thunderbird were stripping the css from my emails. I changed everything to html but the banner is not showing anymore. I've tried everything.
I am really at lost!!!
I use Zen Cart 1.3.7
I don't use the override system.
And here is the code of my email template
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
a:link {color:#808000;
text-decoration: none;}
a:hover {color:#33e1e1;
text-decoration: none;}
a:visited {color:#88aa00;
text-decoration: none;}
body {
background-color: #444444;
}
.disclaimer1 {color:#808000; padding:5px;}
.disclaimer1 a:link {color:#33e1e1;
text-decoration: none;}
.disclaimer1 a:visited {color:#88aa00;
text-decoration: none;}
.disclaimer2 {color:#808000; }
</style>
</head>
<!-- Header Section -->
<div align="center">
<p> </p>
<table width="919" border="1" align="center" cellpadding="10" margin-top="10%" cellspacing="0" bordercolor="#808000" bgcolor="#FFFFFF">
<tr>
<td>
<table width="800" height="177" border="0" cellpadding="10" align="center">
<tr>
<td><img src="http://recycledbyhyena.com/email/header.jpg" width="800" height="177" /></td>
</tr>
</table>
<p> </p>
<div class="content">
<div>$CONTACT_US_OFFICE_FROM</div>
<div>$EMAIL_MESSAGE_HTML</div>
</div>
<!-- Footer Section -->
<p> </p></td>
</tr>
</table>
<br>
<br>
</div>
<div align="center">
<!-- Content Section -->
</div>
<div>
<table width="919" border="1" align="center" cellpadding="10" cellspacing="0" bordercolor="#808000" bgcolor="#FFFFFF">
<tr>
<td><div align="center"><span class="copyright">$EMAIL_FOOTER_COPYRIGHT</span></div></td>
</tr>
</table>
<br>
<br>
</div>
<div>
<table width="919" border="1" align="center" cellpadding="10" cellspacing="0" bordercolor="#808000" bgcolor="#FFFFFF">
<tr>
<td><div align="center"><span class="disclaimer1">$EMAIL_DISCLAIMER</span></div></td>
</tr>
</table>
<br>
<br>
</div>
<div>
<table width="919" border="1" align="center" cellpadding="10" cellspacing="0" bordercolor="#808000" bgcolor="#FFFFFF">
<tr>
<td><div align="center">$EXTRA_INFO</div></td>
<tr>
</table>
<br>
<br>
<br>
</div>
<br>
<br>
</body>
</html>
And here the normal css file
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=$CHARSET" />
<base href="$BASE_HREF" />
<style type="text/css">
body {background-color:#444444;
font-family:Courier New, Courier, mono;
}
.header {
padding:15px;
margin-left:35px;
border:0px solid #808000;
}
a:link {color:#808000;
text-decoration: none;}
a:hover {color:#33e1e1;
text-decoration: none;}
a:visited {color:#88aa00;
text-decoration: none;}
.holder {background-color:#ffffff;
border:1px solid #808000;
font-size:15px;
width:900px;
-moz-border -radius: 15px;
border-radius: 15px;
padding: 10px;
margin-bottom:15px;
margin-top:20px;
margin-left: auto; margin-right: auto;
}
.content {font-size:10px;
padding:10px;
text-align:justify;
width:875px;}
.footer{text-align:center;
font-size:15px;}
.disclaimer {background-color:#ffffff;
border:1px solid #808000;
-moz-border -radius: 15px;
border-radius: 15px;
font-size:10px;
padding:10px;
margin-left: auto; margin-right: auto;
width:900px;}
.disclaimer1 {color:#808000; padding:5px;}
.disclaimer1 a:link {color:#33e1e1;
text-decoration: none;}
.disclaimer1 a:visited {color:#88aa00;
text-decoration: none;}
.disclaimer2 {color:#808000; padding:5px;}
.copyright { padding:5px;
color:#000000;}
</style>
</head>
<body>
<div class="holder">
<!-- Header Section -->
<div class="header"> <img src="/email/header.jpg" />
</div>
<!-- Content Section -->
<div class="content">
<div>Dear $EMAIL_FIRST_NAME $EMAIL_LAST_NAME,</div>
<div>$EMAIL_MESSAGE_HTML</div>
</div>
<!-- Footer Section -->
<div class="footer">
<div class="unsubscribe">$UNSUBSCRIBE_LINK</div>
<div class="copyright">$EMAIL_FOOTER_COPYRIGHT</div>
</div>
</div>
<div class="disclaimer">
<div class="disclaimer1">$EMAIL_DISCLAIMER</div>
<div class="disclaimer2">$EMAIL_SPAM_DISCLAIMER</div>
</div>
</body>
</html>
In advance thank you for the help!!
Bookmarks