HTML gövdesi ile mailto bağlantısı


319

mailtoBir HTML belgesinde birkaç bağlantı var .

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

HTML biçimli gövdeyi, mailto:kısmına ekleyebilir miyim href?

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

İOS'ta (2016), basit italik, kalın biçimlendirme için etiket eklemenin <i>ve <b>etiketlemenin mükemmel olduğunu unutmayın .


1
Aklında tamamen aynı şey vardı ve bir süre çalıştı. İleti gövdesine katıştırılmış bir uzak [img>] almaya çalışıyordum. Mailto komutunun çalışması için URL kodlu olması gerekir. Thunderbird ile elde edilen sonuç, HTML gövdesinin tüm <img> talimatları ve tümü ile tam anlamıyla ortaya çıkmasıydı. Sanırım bu thunderbird ve çoğu posta istemcisinde bir güvenlik sorunu - şüpheli bir şey yapmamak için gelen mailto içeriğini ayrıştırırlar.
Hannes R.

4
Bulabildiğim en iyi şey bu sayfadan geldi, zaposphere.com/html-email-links-code .. Altta bir liste veriyor: "Diğer birçok web sitesinin bahsetmediği diğer harika özelleştirmeler !!" Bana çok yardımcı oldu.
Stu Andrews

Bir e-postanın her bir parçasını temel metinle ayarlayabilirsiniz. Html biçimlendirmenin mümkün olmadığı sınırlamalarla ilgili olarak, bir mailto'daki çeşitli alanları özelleştirmeyi kolaylaştırmak için oluşturduğum bir araç: mailto.now.sh
Dawson B

Yanıtlar:


428

RFC 6068'de görebileceğiniz gibi , bu hiç mümkün değil:

Özel <hfname>"gövde", ilişkili <hfvalue> mesajın gövdesi olduğunu belirtir . "Gövde" alan değerinin, iletinin ilk metin / düz gövde kısmının içeriğini içermesi amaçlanmıştır. "Gövde" sözde başlık alanı, genel MIME gövdeleri için değil, öncelikli olarak otomatik işleme için kısa mesajların (posta listeleri için "abone olun" mesajları) oluşturulması için tasarlanmıştır.


4
@JoeBlow Yanıt hala doğru. 2368'i geride bırakan RFC 6068 , bedenin düz metin olduğunu söylüyor.
Markus Laire

8
Bu yanıtı hayal kırıklığına uğrattıysanız, lütfen okumaya devam edin: stackoverflow.com/a/46699855/256272 (tl; dr .eml dosyaları)
Joe

95

Hayır. Bu hiç mümkün değil.


1
Kesinlikle doğru değil. Destek çok az olsa da, diğer cevaplar iOS'ta bazı sınırlı HTML'nin ve IE + ActiveX + Outlook'un (urgh, yuck) bir kombinasyonunun mümkün olduğunu göstermiştir.
Simon East

89

E-posta gövdenizi biçimlendirmek için HTML kullanmak mümkün DEĞİL olsa da, daha önce önerildiği gibi satır sonları ekleyebilirsiniz.

Javascript kullanabiliyorsanız, "encodeURIComponent ()" aşağıdaki gibi kullanılabilir ...

var formattedBody = "FirstLine \n Second Line \n Third Line";
var mailToLink = "mailto:x@y.com?body=" + encodeURIComponent(formattedBody);
window.location.href = mailToLink;

1
E-posta istemcileri gömülü Javascript çalıştırabilir mi? OP bunun mailto: bağlantısının yer alacağı bir web sayfası olmadığını söylüyor.
wide_eyed_pupil

teşekkürler, raw("text \n more text \n\n\t")
Rails'te

Bu benim için çalıştı, bir Chrome "mailto" dan Outlook'a gönderme. Tüm mailto dizesini değil, yalnızca gövde metnini kodlamanız gerektiğini unutmayın; ve öncesinde / sonrasında boşluklara ihtiyacınız yoktur \n.
Luke

2
Bu yaklaşımı beğendim, işte bunu görmek için bir jsfiddle var: jsfiddle.net/oligray/5uosngy4
Oliver Gray

3
Bir satır kesmesi için yalnızca% 0A kullanabilirsiniz, bu yüzden JavaScript'ten yapmanıza gerek yoktur.
Dirk Boer

58

Ben bunu kullandım ve html kullanarak değil, outlook ile çalışmak gibi görünüyor ama en azından vücut çıktı olarak eklendiğinde metin satır sonları ile biçimlendirebilirsiniz.

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

2
Yani "% 0D" yeni satır. Kodlanmış bir sekmenin kod eşdeğeri nedir?
wide_eyed_pupil

3
% 0D, ctrl-m olan bir yeni satırdır, bir sekme% 09 olan ctrl-i'dir. Bunun gibi bir ASCII grafiğine bir göz atın [ asciitable.com/index/asciifull.gif] . Kontrol karakterleri 1 ile 31 arasındadır. @Wide_eyed_pupil
Jim Bergman

2
Bunu yaparken herhangi bir imza kaldırılmış gibi görünüyor.
Valentin Despa

% 0A olur \ n
Klemen Tušar

3
Bu bir HTML gövdesi değil!
Chloe

46

Bu tam olarak istediğiniz şey değil, ancak istemcide bir EML dosyası oluşturmak ve kullanıcının dosya sistemine Outlook gibi posta programlarında HTML içeren zengin bir e-posta açması gereken dosyayı aktarmak için modern javascript kullanmak mümkündür:

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

İşte görüntüleri ve tabloları içeren bir e-posta jsfiddle: 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);
})();

8
Şimdi bu süslü bir fikir
Greg

2
Güzel bir fikir, ancak en son Apple Mail'deki kayıt için bu dosya açılacak, ancak düzenlenebilir / güvenilir olmayacak, gönderilen bir e-posta kaydı gibi davranıyor
pmarreck

1
Apple Mail (11.2) ile .eml dosyasını açtıktan sonra, e-postayı düzenleme moduna getirmek için menüden Mesaj / Tekrar Gönder'i seçebilirsiniz (shift-cmd-D).
Jeff Collier

31

Bazı şeyler mümkündür, ancak hepsi değil, örneğin <br />kullanımı kullanmak yerine satır sonları istediğinizi söyleyin%0D%0A

Misal:

<a href="mailto:?subject=&body=Hello,%0D%0A%0D%0AHere is the link to the PDF Brochure.%0D%0A%0D%0ATo view the brochure please click the following link: http://www.uyslist.com/yachts/brochure.pdf"><img src="images/email.png" alt="EMail PDF Brochure" /></a>                        

7
Bu HTML değil ... sabit metin.
Brad

e-postanızı $ mailheader kullanarak biçimlendirmezseniz. = "İçerik türü: metin / html; charset = iso-8859-1 \ r \ n";
Stephen Kaufman

12
@StephenKaufman - e-postayı gönderen kişi değil, bağlantıyı tıklayan istemciler sizsiniz. Yani e-posta istemcisinin nasıl ayarlandığını bilmiyorsunuz. Üstbilgilerinin nasıl ayarlandığını bilmiyorsunuz. Bu, bazı e-posta istemcileri üzerinde çalışır ve diğerlerinde çalışmaz.
Narxx

1
teşekkürler, bu benim için ikinci en iyi seçenek, html yapamıyorsam, o zaman en azından taşıma dönüşleri yapabilirim. benim için iyi.
hamish

16

Bu iPhone'da Safari, en azından gibi temel HTML etiketlerini ekleme belirtmekte fayda olduğunu <b>, <i>ve <img>vücut parametresine (ideal CSS tercih artık zaten başka şartlarda kullanmamalısınız olan) mailto:görünmektedir iş - e-posta istemcisi içinde onurlandırılır. Bunun diğer mobil veya masaüstü tarayıcı / e-posta istemci kombinasyonları tarafından desteklenip desteklenmediğini görmek için kapsamlı bir test yapmadım. Bunun gerçekten standartlara uygun olup olmadığı da şüphelidir. Yine de, bu platform için inşa ediyorsanız faydalı olabilir.

Diğer yanıtların belirttiği gibi, bağlantıya gömmeden önce tüm vücutta encodeURIComponent kullanmalısınız mailto:.


Evet, yine de iOS'ta basit kalın, italik etiketler eklemek mükemmel bir şekilde çalışıyor.
Fattie

İOS'ta <img src = 'mybase64' /> ile doğru e-posta gönderemiyorum - Gmail'de mesajımda base64 görüyorum.
Vitaly Zdanevich


0

HTML paylaşma konusunda aynı sorun yaşıyorum. Aşağıda html çalışma benim için yapıyorum. <İle <&> yerine> yazın.

<a href="mailto:?subject=link Share&body=&lt;a href='www.google.com'&gt;google&lt;/a&gt;">Email</a>

Not: Sadece ubuntu'da çalışır. Pencerelerde çalışmaz.


-1

Herkes aşağıdakileri deneyebilir (mailto işlevi yalnızca düz metni kabul eder, ancak burada HTML iç metin özelliklerinin nasıl kullanılacağını ve mailto body params olarak bir çapanın nasıl ekleneceğini göstereceğim):

//Create as many html elements you need.

const titleElement = document.createElement("DIV");
titleElement.innerHTML = this.shareInformation.title; // Just some string

//Here I create an <a> so I can use href property
const titleLinkElement = document.createElement("a");
titleLinkElement.href = this.shareInformation.link; // This is a url

...

let mail = document.createElement("a");

// Using es6 template literals add the html innerText property and anchor element created to mailto body parameter
mail.href = 
  `mailto:?subject=${titleElement.innerText}&body=${titleLinkElement}%0D%0A${abstractElement.innerText}`;
mail.click();

// Notice how I use ${titleLinkElement} that is an anchor element, so mailto uses its href and renders the url I needed

-3

Yeni satırlar eklemek için unicode değerleri girmek mümkündür (yani:), \u0009ancak HTML etiketleri farklı derecelerde desteğe sahiptir ve bundan kaçınılmalıdır.


-11

Bu şekilde çalıştım:

var newLine = escape("\n");
var body = "Hello" + newLine +"World";

Çıktı:

Hello
World  
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.