Is it possible that several mail applications (e.g. Hotmail, Thunderbird, OSx Mail) replace the whole <img> tag?
In the generated newsletter i have e.g.:
<img style="padding: 0px 10px 0px 0px; outline: none; " class="editor-img" src="/upload/11/2_5.jpg" alt="image" width="165" height="107">
and in the received newsletter i got something like:
<img src="foo" border="0">
Can someone explain me that and how i can prevent this?
Thanks
Yes this is absolutely possible. For instance T-Online in Germany exchanges images ending on .php with a dummy image. Many webmailers parse and adapt email code before it is finally rendered in the inbox. Like Gmail tel:-links numbers of which it thinks it's a phone number. In your case, the relative path doesn't make any sense. Try an absolute image path like src="http://www.YOURDOMAIN/upload/11/2_5.jpg".
Related
Why do <p> elements show up differently in Rackspace email, versus other email clients such as Gmail, Outlook.com, Outlook (Desktop Application), and Mail (email client that comes with OS X)?
Here is what my <p> elements look like in Gmail, Outlook.com, Outlook, and Mail:
And here is what my <p> elements look like in Rackspace webmail:
Here is what the code inside of my email looks like:
<p>TEST LINE BREAKS</p>
<p>TEST LINE BREAKS</p>
<p>TEST LINE BREAKS</p>
<p>TEST LINE BREAKS</p>
I tried using this application to normalize my email, but it still does not look the same on Rackspace: http://premailer.dialect.ca/
How could I get the line breaks to appear in the Rackspace email?
Different email clients have different default styles for certain tags (like web browsers). In this case, seems Gmail, Outlook.com, Outlook, and Mail give an unstyled <p> tag a small bottom margin, whereas Rackspace mail does not.
This can be reset by defining an explicit margin. Using an inliner like premailer works just fine, though inlining by hand is more straight forward.
<p style="margin: 0 0 10px;">TEST LINE BREAKS</p>
<p style="margin: 0 0 10px;">TEST LINE BREAKS</p>
<p style="margin: 0 0 10px;">TEST LINE BREAKS</p>
<p style="margin: 0 0 10px;">TEST LINE BREAKS</p>
I've built an HTML Email template which looks really good on most of the email clients but Outlook. It just doesn't want to read any inline CSS for images. Is there are way to hide images just for Outlook? Thanks for the help.
Put this around the image:
<!--[if !mso]><!--> <img> <!--<![endif]-->
I encourage you to post your html email so we could take a look and maybe suggest a solution.
I am using phpmailer to send an email with a button that has a link to another page. For some reason it works almost everytime, except with one specific client of mine. Apperantly his email has is hotmail or outlook.
What happens in this case is that the button comes with a blanked link.
The following peace of code might help:
$mensagem .= '<br><div><!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://" style="height:40px;v-text-anchor:middle;width:200px;" arcsize="8%" stroke="f" fillcolor="#b1cef1">
<w:anchorlock/>
<center>[enter image description here][1]
<![endif]-->
<a href="http://conazweb.com.br/follow-up/'.$opcao1_file.'"
style="background-color:#b1cef1;border-radius:3px;color:#ffffff;display:inline-block;
font-family:sans-serif;font-size:15px;font-weight:bold;line-height:40px;text-align:center;
text-decoration:none;width:300px;margin-left: 15%; margin-right: 15%;-webkit-text-size-adjust:none;">COMPRAR VIA CONAZ</a>
<!--[if mso]>
</center>
</v:roundrect>
<![endif]--></div>';
By doing a code inspection on the button on the case that the problem is occuring I got the following code:
https://www.dropbox.com/s/dtyhtrvdk0nas5d/Inspection%20button.png?dl=0
This is ancient Microsoft VML, essentially nothing uses it any more, and support has even been dropped from Internet Explorer. If you want links to work, use plain links, which you can style to look like buttons.
I'll be upfront about the complete lack of coding experience I have, so any and all help is appreciated.
My Facebook pixel was tracking traffic without any problems for my client's site...up until he moved the registration page to a sub-domain. The tracking then immediately cut off.
This wouldn't usually be a problem b/c we can rely on Google Analytics for conversion data, but in this case, it matters since our campaigns were optimized around the conversion data acquired in Facebook.
According to the FB rep I talked to earlier, our sub-domain is recognized as a completely different site and therefore, can't be tracked.
I don't buy this...I can't be the first person to come across such a simple problem. Any FB developers out there with a workaround?
I know it's been a few months since you asked the question, but I thought I'd update (found this myself via a Google Search).
Something you could look at doing is putting the Facebook Tracking pixel on the main domain, then including it in an iframe on the registration page. You can then use the iframe URL for the "conversion URL" on the Facebook end:
Here's a JSFiddle with some sample code you can use: https://jsfiddle.net/dxz68suw/
HTML:
<div id="fb-pixel-outer">
<iframe src="http://mainsubdomain.yoursite.com/track-conversion.html" id="fb-pixel-inner">
</iframe>
</div>
<!-- track-conversion.html should be a basic HTML page containing your Facebook Pixel code -->
CSS:
/** Outer container, this prevents scrollbars from appearing due to iframe positioned outside of viewport **/
#fb-pixel-outer {
overflow: hidden;
position: absolute;
top: 0px;
left: 0px;
}
/** this styling ensures that the iframe is miles outside of the viewport, and loaded by browser **/
#fb-pixel-inner {
position: absolute;
left: -9999px;
top: -9999px;
overflow: hidden;
display: block;
width: 1px;
height: 1px;
}
It's a bit hacky, and not ideal, but should work.
Where does the above code go? On your main domain header?
Does this look right to you?
<div id="fb-pixel-outer">
<iframe src="https://botox.everyoungmed.com/track-conversion.html" id="fb-pixel-inner">
</iframe>
</div>
<!-- track-conversion.html should be a basic HTML page containing your Facebook Pixel code -->
When sending an HTML e-mail, is there any sense in using the <title> tag? In the PHP Manual, for instance, they use such a tag in their main sample code. However, I see no reason why an e-mail client would use this title and not the Subject from the e-mail. Is there any reason to set this tag?
I've been looking into this myself as I'm writing a PHP mailing list manager script that uses the sendmail() function.
The script allows the admin to create and send multiform emails (both text and html versions).
After much testing I have found that some email servers appear to have issues with the title tag (<title></title>).
I created a test email and sent it to 5 of my email address, my #blueyonder.co.uk email failed to arrive but the 4 others had no problems.
After a process of elimination it turned out that the #blueyonder.co.uk mail servers did not like the title tags in the html part of the email message, when I removed the tag the email arrived no probs.
Very strange!
The only use I would see is that some clients, like Outlook, allow you to view an email in a browser for better rendering. It would then be a plus to have the html title tag set.
(Old question, I know ;) )
My experience is that some mail clients will display the <title> tag in their email preview and some won't. Some clients preview will be "Subject + <title> + Preheader" and some will only be "Subject + preheader", so that creates an inconsistent experience.
Because of that, I found it's better to only use a preheader.
For completion's sake, the "Preheader" is a hidden text form the body that is only used in the preview, for example, something like...
<div style="display: none; max-height: 0px; overflow: hidden;">
Insert hidden preheader text here
</div>