0

I'm trying to create a mailto link that programmatically includes the current domain in the mail subject when clicked.

This is what I have so far:

<div class="cta">
Make an enquiry at <a href="javascript:'mailto:sales@hashimaziz.com?subject=Sales%20Inquiry%20RE:%20' + window.location.hostname;">sales@hashimaziz.com</a>
</div>

The JavaScript itself seems to work, but when the mailto link is clicked, it goes to a white page that prints the text of the mailto command itself. This can be tested on the website itself here.

What's wrong with the mailto link that's preventing it from behaving as it should?

Hashim Aziz
  • 4,074
  • 5
  • 38
  • 68
  • Why do you have both `javascript:` and `mailto:`? – Pointy May 01 '20 at 16:00
  • @Pointy To add the domain name to the subject line. – Hashim Aziz May 01 '20 at 16:10
  • Well ultimately you can't 100% rely on mail user agents paying any attention to the subject parameter. – Pointy May 01 '20 at 16:25
  • @Pointy The mailto `subject` and `body` syntax are a [part of the RFC](https://stackoverflow.com/a/41365892/1191147), I can't see any modern mail client not supporting them. – Hashim Aziz May 01 '20 at 17:46
  • Not everybody is using a "modern mail client", and web mail clients won't pay attention to the `mailto:` links at all (at least mine, GMail, doesn't) – Pointy May 01 '20 at 17:57
  • @Pointy Neither does Outlook.com. Unfortunately `mailto` links were never really designed for web mail clients, I'm mainly using it to cover the standalone mail clients while ensuring the address itself is visible to copy for web mail clients. – Hashim Aziz May 01 '20 at 18:01

1 Answers1

2

JavaScript URLs, when navigated to, evaluate an expression and print it.

You can use:

<div class="cta">
Make an enquiry at <a href="javascript:void(window.location.href%3D'mailto%3Asales%40hashimaziz.com%3Fsubject%3DSales%2520Inquiry%2520RE%3A%2520'%2Bwindow.location.hostname)">sales@hashimaziz.com</a>
</div>

Or, possibly better:

<div class="cta">
    Make an enquiry at <a id="contact-link">sales@hashimaziz.com</a>
</div>

<!-- New script tag not necessary. -->
<script>
    document.getElementById("contact-link").href = 'mailto:sales@hashimaziz.com?subject=Sales%20Inquiry%20RE:%20' + window.location.hostname;
</script>
D. Pardal
  • 6,173
  • 1
  • 17
  • 37
  • Scratch that, it doesn't seem to actually add the current domain at the end, so the only thing in the subject line is `Sales Inquiry RE:`. – Hashim Aziz May 01 '20 at 16:19
  • Did you use the first solution or the second one? – D. Pardal May 01 '20 at 16:19
  • The inline one, purely because I wanted to avoid externalising the code anywhere else for such a small piece of JS. – Hashim Aziz May 01 '20 at 16:20
  • It seems to work in Firefox (not when I type it in the address bar, though). – D. Pardal May 01 '20 at 16:24
  • Also using Firefox, but when clicking the `mailto` link, no subject is shown, at least on Windows 10's Mail app. I'll try the other method to see if the inline solution is the problem. – Hashim Aziz May 01 '20 at 16:29
  • I updated the inline solution with a properly encoded URI, but that may not be the problem. – D. Pardal May 01 '20 at 16:31
  • Yeah, can confirm the inline solution behaves the same. Testing the second solution now. – Hashim Aziz May 01 '20 at 16:39
  • The script solution behaves in the same way, tested on both Windows 10's native Mail client and Mozilla Thunderbird. – Hashim Aziz May 01 '20 at 17:33
  • I don't know why it doesn't work for you. I have tested in Firefox an Chrome (both with the Windows 10 Mail app) and it works just fine. – D. Pardal May 01 '20 at 18:11
  • My bad, turns out the issue was that I was testing it locally, which it doesn't see as having a domain. I tested the inline version on the live site and it works perfectly. Thanks for your help with this. – Hashim Aziz May 01 '20 at 22:23