Hi all, I have problem with sending HTML mails with PHPmailer. I make Smarty template and I got all the HTML code from it but when I send mail, I got the mail witouth included CSS (it's only background-color, font or something like that). In PHPmailer I set that the mail is HTML.
Is there any way to send HTML mail with included CSS?
Thank you
HTML and CSS is fraught with pain and frustration. Nothing to do with PHP, it's apparent that most implementations coughoutlook*cough* were and remain archaic.
This is the only area where I would advise this (and someone else might have a better understanding/plan*), but you should look at cutting the CSS and writing mid-90's style html with <table>, <font> and <hr> tags (oh my)
** please share :)*
How is your stylesheet referenced?
For email you will either have to provide an absolute path to your stylesheet or include the styles in the head of the template
I assume you have your CSS in an external file, if so the easiest solution would be to simply move it into the html header inside the mail.
However, css support in email clients is very wonky, so it might just be crappy rendering on their part.
See the Email Standards Project for a pretty thorough analysis of the state of email clients with regards to CSS support.
CSS support in e-mail is very limited, at least. The biggest issue is that different clients support different sets of CSS-properties.
You provide very little context for us to work with.
For more information on CSS support in e-mail, please refer to this excellent overview.
Some Email Clients will strip out the <head> section so put your <style></style> tags within the <body>.
I've found the best (read broadest) support for CSS is inline (style=""). Sad, but true.
here is a really good site point article on html emails http://www.sitepoint.com/article/code-html-email-newsletters/
Thank you all for comments :) It works with inline styles :) Well, yes, that's pretty sad :)
Theres is a way...
$body = <<< YOUR_HTML_WITH_CSS_STYLE_TAGS
<html>
<head>
<style>
body * {width:1px;}
#adiv {padding:2px;}
.aclass {margin:3px;}
</style>
</head>
<body>
<div>
some html
</div>
<div id="adiv">
<p class="aclass">
</p>
</div>
</body>
</html>
YOUR_HTML_WITH_CSS_STYLE_TAGS;
$doc = new DOMDocument();
@$doc->loadHTML($body);
$xpd = new DOMXPath($doc);
0&&$node = new DOMElement();
$result = $xpd->query('//img');
foreach($result as $node){
$attr = $node->getAttribute('src');
$re = '/(http:\/\/.*?)?(\/.*+)/i';
if(preg_match_all($re, $attr, $matches)){
if(!empty($matches[1][0])&&0)
continue;
$attr = 'http://'.$_SERVER['HTTP_HOST'].$matches[2][0];
}
$node->setAttribute('src',$attr);
}
false&&$node=new DOMElement()&&$child=new DOMElement();
$result = $xpd->query('//style/..');
foreach($result as $node){
foreach($node->childNodes as $child){
if(strtolower($child->nodeName)=='style'){
$node->removeChild($child);
$css = $child->textContent;
$re = '/(.*?)\{([^}]+)\}/';
if(preg_match_all($re, $css, $matches)){
foreach($matches[1] as $idx=>$css_selector){
$css_text = $matches[2][$idx];
$css_text = preg_replace('/\s+/',' ',$css_text);
$css = new CSSQuery($doc);
foreach($css->query($css_selector) as $selected_node){
$style = $selected_node->getAttribute('style');
$selected_node->setAttribute('style', $style?$css_text:$style.';'.$css_text);
}
}
}
}
}
}
$body = $doc->saveHTML();
That code will generate an HTML output in $body like this:
<html>
<head>
</head>
<body>
<div style="width:1px;">
some html
</div>
<div id="adiv" style="width:1px;padding:2px;">
<p class="aclass" style="width:1px;margin:3px;">
</p>
</div>
</body>
</html>
the CSSQuery class can be found at phpclasses.org . This implementation is based on the fact that most webmails will only allow to add style by inline tag attributte style and not through style tags or link tags. Its pretty much limited an with a restricted sintax because of the regexp its kind of simple but its still better than write by your own the inline style attributes in each html tag.