I'm creating a simple email client and I'm having trouble with Reply and Forward in html emails.
When I have the user compose the reply message, how do I append that content to the top of the message? I have done some investigating with how outlook does it by injecting the new message content into a paragraph or div or something like that.
How is it done in general, i.e. gmail, yahoo, etc. How do they figure out where to inject the reply content in the html?
I'm using c# so ideally there is some c# library that can handle this? If not then some idea how it's done generally so I can create a solution for it.
I've read wikipedia's Posting Style article and it gives a good overview of the general idea but nothing about how to do it in html.
Some Background
When composing HTML email, it is important to recognize that email clients have rather limited support for HTML and the level of support varies across email clients.
Because of that, although <div> and CSS are the correct layout tools for web pages, that is not true for HTML email. Even today, use <table> for layout control for HTML emails.
Additionally, the only reliable means to apply CSS is to the HTML elements with a style= attribute on each element. CSS declarations in a <head> section are often ignored by the email client. When crafting HTML email, I actually use CSS in the <head> and, once it looks correct, use this page to convert the HTML to use style= attributes. There are other options.
Not only will the <head> tag often be ignored, but so will any <body> tag.
Solving Your Problem
I would suggest placing the text included in the reply within a table (with a single <tr> and single <td>), and applying an inline CSS style to that table. That allows you to apply formatting, such as placing a colored bar down the left-hand side, italicizing the text, etc.).
Related
I am sending emails to users which includes a one-time authentication link. I am trying to develop a feature through which if a user forwards the email to some other user, the links should get disabled.
One way is to hide the link by using a style tag which is covered here:
<style type="text/css">
blockquote .original-only, .WordSection1 .original-only {
display: none !important;
}
</style>
<p class="original-only">
Content to be hidden Unsubscribe.
</p>
Is there a better/standard way to achieve the same? I would prefer to keep the link visible but clicking on the link will take the user to my web where I can check URL params to validate if the email is original or forwarded.
I don't think it would work, but for a different reason - Office 365 can "probe" the link first to see if it points to anything untoward. Your server would register a hit, but it won't be coming from a user.
A foolproof way forward is essentially not possible, although you may be able to do it with some success on some platforms. (There isn't even a way to target all email clients individually on a straight send--let alone on a forward!)
What happens when you forward an email is that the email will be re-rendered, often without the accompanying embedded CSS that you are relying on (it depends on the email client).
So the reference to the class would be lost, and your link would now show after a forward:
<p class="original-only">
Content to be hidden Unsubscribe.
</p>
Furthermore, I see what you are trying to do there, in predicting that a forward would add a blockquote or a style like WordSection - but not all behave predictably, or if they do, you can't target them. For example, Gmail will add a class that begins with something like "_m" (from memory), but although CSS can target that with an [attribute^="value"] selector, most email clients will ignore this 'advanced' CSS.
In fact, you may have more luck reversing this:
<style type="text/css">
blockquote .original-only, .WordSection1 .original-only {
display: block !important;
}
</style>
<p class="original-only" style="display:none">
Content to be hidden Unsubscribe.
</p>
I haven't tested it, but if you sent that to, say, Gmail (noting some Gmails are different from others, e.g. IMAP/POP accounts), which DOES support embedded CSS, you would see the unsubscribe link. But forwarding might just remove the embedded CSS and so the display:none would kick in and hide the link.
However, if you sent it Outlook desktop, which does NOT support embedded CSS (anything in <style>...</style>), it would hide the unsubscribe link by default, as well as keep it hidden on a forward (probably).
Results are likely to be all over the place.
In my ColdFusion program I create email (HTML/CSS) for one or many recipients, and place it in a .cfm file. The email is nicely formatted. When I run the saved file as a program, the cfmail tag sends the email along to whomever, and that is all working. However, along the way, my formatting gets lost. I understand that there is no reason for my local CSS to be functioning when the email gets to its target. But it would be nice if I could preserve the formatting I started with.
Does anyone have a suggestion about how I might do this.
If you're not including the attribute type="html" in your cfmail tag, that could be affecting the formatting of your email. Also, within the cfmail tag, embed your style within in addition to your content. For example:
<cfmail from="foo#bar.com" to="foobar#bar.com" subject"test" server="mymailserver" type="html">
<html>
<head>
<style>
.test { color: ##cc0000; }
</style>
</head>
<body>
<div class="test">This email is in red</div>
</body>
</html>
</cfmail>
Styling emails can be tricky as it's different across clients - there are whole blog articles devoted to this. For example, styles in the head section get ignored in some clients and recognised in others. Sadly, inline styles seems to be the "best" approach.
There is a good overview on the campaign monitor website of what works if which clients:
https://www.campaignmonitor.com/css/
Mailchimp have a handy tool which will inline styles for you based on your HTML/CSS:
http://templates.mailchimp.com/resources/inline-css/
It's also worth including a plain text version for maximum compatibility. You can do that like this:
<cfmail to="someone#somewhere.xyz"
from="me#here.xyz"
subject="Hello!"
type="html">
<cfmailpart type="text/plain" wraptext="60">
Hello,
This is plain text version
</cfmailpart>
<cfmailpart type="text/html">
<h3>Hello</h3>
<p>This is <b style="color:red;">HTML</b> version</p>
</cfmailpart>
</cfmail>
Mandrill allows you to attach the mc:hideable attribute on an element in HTML email, as in
<p mc:edit="section_1" mc:hideable>
Content that I only want to show on some emails.
<a href="http://link.to/do/something">
Because it has a link that only applies sometimes
</a>
</p>
<p mc:edit="section_2">
Variable content that I want to show every time.
</p>
With this example template, using the mc:edit="name" attribute, I can change the content in "section_2" very easily by editing the "template_content" field via the messages API, as in:
"template_content": [{"name": "section_2", "content": "Some content"}]
Is there a way to hide the content in "section_1"? It seems like this should be easy.
Mandrill currently supports a subset of the MailChimp template language (specifically regions with mc:edit attributes). While it's possible to have the mc:hideable attribute and it won't cause errors in using the template, Mandrill doesn't yet support hiding those elements when sending the email. The same goes for other MailChimp template language attributes, like mc:repeatable and editable image areas - they won't break, but replacing them isn't currently possible in the send-template API call.
More information about using templates with Mandrill can be found here: http://help.mandrill.com/forums/20689686-Templates-and-Dynamic-Content
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>
I have been looking at some methods for spamproof email methods here. I'd like to propose a more simple approach: Since I need a couple of different email addresses I considered just using a selectbox with JS or serverside redirect, as per examples on here.
Because google doesn't spider forms (dixit Matt Cutts), and spam-harvester script don't either (I think????) this would make sense to do.
I would love to be able to do this without using a script. So why not use one form per email?
<form action="mailto:test#domain.tld" method="get">
<input type="submit" value="test#domain.tld"/>
</form>
It seems the button text can be copied but not pasted, so that's a disadvantage.
Is this approach any good? or any other recommendations?
A robot uses the text of the page to get the email. It does not care if that text is in a button or within the body so using a button will not help.
Outside of using javascript, the only solution I know of would be written text, an image or Flash.
Create an image with your email or write out the email like: "test at domain dot tld"
Flash could provide you with a more secure (but not 100%) way of allowing people to click on an email but would not work on iPhone browsers and those that do not have the plug-in.
Another way is to use a simple captcha to before displaying the email in the PHP code.
Email: (1+2 = ?) then test#domain.tld
Because:
The email address is still in the page, and thus easily harvestable
mailto: URIs as form actions often fail
The reason server side form handlers stop email addresses being harvested is because the email address is not exposed to the user.