90

I have an HMTL / CSS website built in Dreamweaver CS4 and I would like to add a 'share by email' link to the site (so that anyone who clicks on it can easily send a link to the site to their chosen recipient). I would like one of those envelope icons, but preferably customisable in size so it would fit nicely with other icons I have.

Please could someone kindly advise me as to what is the easiest way of doing this?

starball
  • 20,030
  • 7
  • 43
  • 238
noobug
  • 953
  • 1
  • 7
  • 11

4 Answers4

251

Something like this might be the easiest way.

<a href="mailto:?subject=I wanted you to see this site&amp;body=Check out this site http://www.website.com."
   title="Share by Email">
  <img src="http://png-2.findicons.com/files/icons/573/must_have/48/mail.png">
</a>

You could find another email image and add that if you wanted.

tanguy_k
  • 11,307
  • 6
  • 54
  • 58
Brian Murphy
  • 2,655
  • 1
  • 14
  • 7
  • 12
    Beware: many desktop users use webmail, and for them mailto links will not open their actual email client. Instead, they will open whatever email client happened to ship with their computer (Apple Mail, Outlook, etc), which probably isn't even configured. – bobpoekert May 16 '14 at 20:02
  • Is there a way to display an alternative text to `http://www.website.com` in the email body, like `[link](http://example.com)` in this comments function? – Pingui Jun 27 '14 at 14:27
  • How can we attach a file or document for this? When clicked the subject,body and file should appear in compose mail. (Im working on Outlook.) – Salman Riyaz Mar 24 '17 at 05:52
  • How to add Unordered list in email body – Akshay Dattatray Nangare May 12 '17 at 11:07
-2

If you want to add a link in a link option in your WordPress website, you should use this code only. href="mailto:?subject= I want to share this with you &amp;body= Hi there, Check out this site http://www.website.com. Thanks.

Example:

enter image description here

-6

Easiest: http://www.addthis.com/

Best? Well. probably not, But If you don't want to design something bespoke this is the best there is...

Myles Gray
  • 8,711
  • 7
  • 48
  • 70
-16
<a target="_blank" title="Share this page" href="http://www.sharethis.com/share?url=[INSERT URL]&title=[INSERT TITLE]&summary=[INSERT SUMMARY]&img=[INSERT IMAGE URL]&pageInfo=%7B%22hostname%22%3A%22[INSERT DOMAIN NAME]%22%2C%22publisher%22%3A%22[INSERT PUBLISHERID]%22%7D"><img width="86" height="25" alt="Share this page" src="http://w.sharethis.com/images/share-classic.gif"></a>

Instructions

First, insert these lines wherever you want within your newsletter code. Then:

  1. Change "INSERT URL" to whatever website holds the shared content.
  2. Change "INSERT TITLE" to the title of the article.
  3. Change "INSERT SUMMARY" to a short summary of the article.
  4. Change "INSERT IMAGE URL" to an image that will be shared with the rest of the content.
  5. Change "INSERT DOMAIN NAME" to your domain name.
  6. Change "INSERT PUBLISHERID" to your publisher ID (if you have an account, if not, remove "[INSERT PUBLISHERID]" or sign up!)

If you are using this on an email newsletter, make sure you add our sharing buttons to the destination page. This will ensure that you get complete sharing analytics for your page. Make sure you replace "INSERT PUBLISHERID" with your own.

Jack
  • 10,943
  • 13
  • 50
  • 65