Trying to add the title tag to a mailto link, with the URL in the body

Question

I am creating a help site for our product. It will be deployed by our customer services group on the web (for logged in customers), and it will be deployed with our software. We wanted to create a feedback mechanism, but we can't use a server-side script, since in some cases, users will be viewing the help site locally.

We are working on a long term solution, but for now we are trying to do this with a simple <a href="mailto"> link (which we've formatted to look like a button):

<p class="docfeedback"><a href="mailto:example@example.com?subject=Documentation Feedback" title="We welcome your feedback on this documentation. If you cannot send mail from this server, please send your feedback to: example@example.com>

What I want is to get the value of the <title> element and put that in the Subject, and I'd like to get the url pathname (pathname only) in the body line.

I've read several answers that give me part of the solution, but I'm hoping to put it all together, and coded the right way.

I've been reading about using javascript to get the URL, which I was able to do successfully in the body of the message. But then I tried to use this answer to put the first H1 in the topic as the subject of the message. I then changed it to get the title element. (My project has access to jquery [1.8.3] automatically, so I don't have to specifically call it.)

So, that worked, but I am not sure how to put them both together. Here is the current code in my HTML.

<script>
  $(document).ready(function(){
  var mailtoHref = $('#mailme a').attr('href'); //get href
  var h1Text = $('title').text(); //get h1 text
  $('#mailme a').attr('href', mailtoHref + h1Text ); //append it to mailto://
  });
</script>
<div id="mailme">
  <p class="docfeedback">
    <a href="mailto:example@example.com?subject=Documentation Feedback for topic: " title="We welcome your feedback on this documentation. If you cannot send mail from this server, please send your feedback to: example@example.com">Send us documentation feedback</a>
  </p>
</div>

p.docfeedback /* only used on master page for feedback link */
{
 text-align: center;
 font: bold 11px Arial;
 text-decoration: none !important;
 background-color: #EEEEEE;
 padding: 5px 9px 5px 9px;
 border: 1px solid #CCCCCC;
 border-radius: 10px;
 width: 225px;
}

p.docfeedback a:link,
p.docfeedback a:visited,
p.docfeedback a:hover,
p.docfeedback a:active
{
 color: #666;
 text-decoration: none !important;
}

<head>
  <title>This is the name of the document</title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  </head>
  <script>/* <![CDATA[ */
    $(document).ready(function(){
    var mailtoHref = $('#mailme a').attr('href'); //get href
    var h1Text = $('title').text(); //get h1 text
    $('#mailme a').attr('href', mailtoHref + h1Text ); //append it to mailto://
    });
   /* ]]> */</script>
            <div id="mailme">
                <p class="docfeedback"><a href="mailto:example@example.com?subject=Documentation Feedback for topic: " title="We welcome your feedback on this documentation. If you cannot send mail from this server, please send your feedback to: example@example.com">Send us documentation feedback</a>
                </p>
            </div>

Any help you can provide, I would greatly appreciate.

Jakob · Accepted Answer · 2016-05-12T23:43:24.193

2

jQuery for adding current url to body of email is below

 $(document).ready(function() {
   var url = window.location.href; //get url
   var h1Text = $('title').text(); //get h1 text
   var email = 'example@example.com';
   var body = url;
   var subject = 'Documentation Feedback for topic: '+h1Text;
   var hrefTitle = 'We welcome your feedback on this documentation. If you cannot send mail from this server, please send your feedback to: '+email;
   $('#mailto').attr('href','mailto:'+email+'?body='+body+'&subject='+subject);
   $('#mailto').attr('title', hrefTitle);
 });

And html mailto link is like this now

<a id="mailto" href="" title="">Send us documentation feedback</a>

Full code is here https://jsfiddle.net/50c99uan/2/

edited May 12 '16 at 23:43

answered May 12 '16 at 23:03

Jakob

3,493
4
26
42

I have the subject line the way I want it. I'm trying to add the URL path to the file in the body of the email message. I want to see the filename of the page that the person was on when they clicked the button, if that makes sense. – Paul Pehrson May 12 '16 at 23:10
1

ok, you can add url in body of message like in updated code.. I also set it all in jquery so it is easier to manipulate with data. You can test it in jsfiddle – Jakob May 12 '16 at 23:46

Trying to add the title tag to a mailto link, with the URL in the body

1 Answers1