Blogging Tips Google Programming tricks Tricks by geetamamuni

How to Put a Mailto Button in Your Site Directly Linked to Gmail

Every bloggers and site owners put a mailto button on their site so as to help their visitors to contact them directly via email. The common syntax to put a mailto hyper link is mailto:YOUR_EMAIL. When somebody clicks on such link, the default email client will open in the user’s PC with the address pointing to the mailto email ID. But there are a lot of issues you may face putting such links on your site. Here are some of them I have listed out.

Problems with emailto links


  • It opens the default desktop email client to send email, but now-a-days people rarely install such clients due to rise in web based emails.
  • In many cases, although the email client is installed but they are not configured.
  • In both of above cases browser creates an annoying situation for the users. Either it will show an error message saying no email client has been installed or it will start showing configuration pop up to configure your email client if it is not confugured previously.
So what is the solution to above problem ? We can have some workaround like pointing users directly to browser based Gmail instaed of opening the desktop email client.


How to link to Gmail compose window directly


You can directly link a mailto button to Gmail compose window in full screen mode. Following is the URL to link. The only requirement for this is, user must be login to view the compose window. If user is not login then she/he will be redirected to login page.

https://mail.google.com/mail/?view=cm&fs=1&to=myEmail@example.com&su=SUBJECT&body=BODY&bcc=myFriendsEmail@example.com


To put such a link in your site just add following code.

<a href=”https://mail.google.com/mail/?view=cm&fs=1&to=myEmail@example.com&su=SUBJECT&body=BODY&cc=anotherEmail@example.com&bcc=myFriendsEmail@example.com” target=”_blank”>Write to us</a>

The only concern of this method is, if user is not currently login she/he will be redirected to login page first. Except this, there is no other issue. It looks awesome on your site.

You can also add some extra flavors to this technique. You can link to Gmail compose window only if the user is currently login in Google, otherwise display the traditional mailto. Here is how you  do it.


Linking to Gmail compose window only if user is currently login


Paste the following code in your site to open Gmail compose window based upon user’s login. To verify the functionality, open following link in your browser with and without login. You can understand the difference.

<a href=”mailto:hdas2012@outlook.com” id=”fblMailtoLink”>
Write to us
</a>
<script>
function manageMailToLink(){
var MAIL_TO = “hdas2012@outlook.com”;
var MAIL_CC = “hdas2013@yahoo.com”;
var MAIL_BCC = “hdas2013@yahoo.com”;
var MAIL_SUBJECT = “About Fun But Learn”;
var MAIL_BODY = “This is awesome”;
var url = “https://mail.google.com/mail/?view=cm&fs=1&to=”+MAIL_TO+”&su=”+MAIL_SUBJECT+”&body=”+MAIL_BODY+”&cc=”+MAIL_CC+”&bcc=”+MAIL_BCC;
document.getElementById(“fblMailtoLink”).setAttribute(“href”,url);
document.getElementById(“fblMailtoLink”).setAttribute(“target”,”_blank”);
}
</script>

<img style=”display:none;”
onload=”manageMailToLink();”
src=”https://accounts.google.com/CheckCookie?continue=https%3A%2F%2Fwww.google.com%2Fintl%2Fen%2Fimages%2Flogos%2Faccounts_logo.png&followup=https%3A%2F%2Fwww.google.com%2Fintl%2Fen%2Fimages%2Flogos%2Faccounts_logo.png&chtml=LoginDoneHtml&checkedDomains=youtube&checkConnection=youtube%3A291%3A1″
/>

 Hope you liked the trick. Let me know your views in the comments.

1 thought on “How to Put a Mailto Button in Your Site Directly Linked to Gmail”

Leave a Reply

Your email address will not be published. Required fields are marked *