email formatting insert - mailto link with HTML body





5 Answers

No. This is not possible at all.

code table bold

I have a couple of mailto links in a HTML document.

<a href="mailto:etc...">

Can I insert HTML formatted body in the mailto: part of the href?

<a href="mailto:me@me.com?subject=Me&body=<b>ME</b>">Mail me</a>

Note that (2016) in iOS, it is perfectly fine to add <i> and <b> tags for simple italic, bold formatting.




I have used this and it seems to work with outlook, not using html but you can format the text with line breaks at least when the body is added as output.

<a href="mailto:email@address.com?subject=Hello world&body=Line one%0DLine two">Email me</a>



It's not quite what you want, but it's possible using modern javascript to create an EML file on the client and stream that to the user's file system, which should open a rich email containing HTML in their mail program, such as Outlook:

https://.com/a/27971771/8595398

Here's a jsfiddle of an email containing images and tables: https://jsfiddle.net/seanodotcom/yd1n8Lfh/

HTML

<!-- https://jsfiddle.net/seanodotcom/yd1n8Lfh -->
<textarea id="textbox" style="width: 300px; height: 600px;">
To: User <user@domain.demo>
Subject: Subject
X-Unsent: 1
Content-Type: text/html

<html>
<head>
<style>
    body, html, table {
        font-family: Calibri, Arial, sans-serif;
    }
    .pastdue { color: crimson; }
    table {
        border: 1px solid silver;
        padding: 6px;
    }
    thead {
        text-align: center;
        font-size: 1.2em;
        color: navy;
        background-color: silver;
        font-weight: bold;
    }
    tbody td {
        text-align: center;
    }
</style>
</head>
<body>
<table width=100%>
    <tr>
        <td><img src="http://www.laurell.com/images/logo/laurell_logo_storefront.jpg" width="200" height="57" alt=""></td>
        <td align="right"><h1><span class="pastdue">PAST DUE</span> INVOICE</h1></td>
    </tr>
</table>
<table width=100%>
    <thead>
        <th>Invoice #</th>
        <th>Days Overdue</th>
        <th>Amount Owed</th>
    </thead>
    <tbody>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    </tbody>
</table>
</body>
</html>
</textarea> <br>
<button id="create">Create file</button><br><br>
<a download="message.eml" id="downloadlink" style="display: none">Download</a>

Javascript

(function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }
    textFile = window.URL.createObjectURL(data);
    return textFile;
  };

  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');
  create.addEventListener('click', function () {
    var link = document.getElementById('downloadlink');
    link.href = makeTextFile(textbox.value);
    link.style.display = 'block';
  }, false);
})();



It is possible to enter unicode values to insert newlines (ie: '\u0009') but HTML tags have varying degrees of support and should be avoided.




Here's how you add everything to a MAILTO link:

<a href="mailto:YourName@YourSite.com? cc=someone@YourSite.com&bcc=someoneElse@YourSite.com &subject=Shipping%20Information%20Request&body=Please%20tell%20me%20if%20my%20order%20has%20shipped!">Shipping Request</a>

Each component is separated by the ampersand (&) sign. Only the first component after the initial email address has a question mark (?) preceding the ampersand.

URL-encode is the key! So for your example of a body, instead of your

href='mailto:me@me.com?subject=Me&body=<b>ME</b>'

...you might try:

href='mailto:me@me.com?subject=Me&body=%3cb%3eME%3c%2fb%3e'

Here's another route you might try. Create a javascript function to open an ActiveX object. This has the unfortunate limitation of only working in IE and Outlook, and may cause your page to show activex warnings. But if you can live with these caveats, it does the job. Here's a working sample you can draw from:

<html>
    <head>
        <script type='text/javascript' language='javascript'>
            function OpenOutlookNewEmail()
            {
                try
                {
                    var outlookApp = new ActiveXObject("Outlook.Application");
                    var nameSpace = outlookApp.getNameSpace("MAPI");
                    mailFolder = nameSpace.getDefaultFolder(6);
                    mailItem = mailFolder.Items.add('IPM.Note.FormA');
                    mailItem.Subject = "Me";
                    mailItem.To = "me@me.com";
                    mailItem.HTMLBody = "<b>ME</b>";
                    mailItem.display(0);
                }
                catch (e)
                {
                    alert(e);
                    // act on any error that you get
                }
            }
        </script>
    </head>
    <body>
        <a href='javascript:OpenOutlookNewEmail()' >email</a>
    </body>
</html>





Related