Convert the Mailto Hyperlinks into a Contact Form

Published in: WordPress

Websites use the mailto protocol to convert plain-text email addresses into hyperlinks. When someone clicks an hyperlinked email address,  it opens a new message in their default email program allowing them to quickly compose and send an email to that particular address.

Some website owners hide their email addresses but instead offer inline contact forms allowing visitors to reach them directly without having to use an external email program.

contact form

SquareSend offers the best of both worlds. The service will auto-convert the mailto hyperlinks on your web page into inline contact forms and, to get this to work, all you have to do is insert a single line of JavaScript into your web template.

To get a taste of how this thing works, click my email address - this is a standard mailto link but instead of opening a message in your email program, you should see a modal contact form in the browser.

Getting started is easy. Create an account at SquareSend with the email address that you would like to use in your mailto links and then copy-paste the following snippet of JavaScript code into your blog /website template. That’s it.

// Replace with your own email address Email Me:
<a href=""></a>

// The SquareSend JavaScript will load asynchronously // without affecting the
load time of your web page

<script type="text/javascript">
  (function () {
    var ss = document.createElement('script');
    ss.type = 'text/javascript';
    ss.async = true;
    ss.src = document.location.protocol + '//';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(ss, s);

When someone contacts you via the SquareSend enabled mailto link, you’ll get a copy of the message in your primary mailbox and a copy will also be delivered to your SquareSend account. The service supports custom parameters allowing you to easily customize forms.

SquareSend is a freemium service. You can associate up to five different email addresses with your account and the free plan would allow you to receive up to 50 email messages per month.

Bonus Tip for WordPress users

The email address on your web page can be easily harvested by spam bots but if you are on WordPress, there’s a little-known function called antispambot that will hide your address behind HTML characters making it nearly invisible to spam bots.

// This will appear as a regular email address to humans but spam
// bots will only see some weird HTML characters

<a href='mailto:<?php echo antispambot(""); ?>'>
	<?php echo antispambot(""); ?>

Just use the above snippet wherever you wish to display your email address and you should be safe. Human visitors will see the regular email address while bot will see some weird HTML characters.

If you aren’t on WordPress, see other ways to hide your email address on websites.

📮  Subscribe to our Email Newsletter for Google tips and tutorials!
Published in: WordPress

Looking for something? Find here!

Meet the Author

Web Geek, Google Developer Expert
Amit Agarwal

Amit Agarwal is a Google Developer Expert in Google Workspace and Google Apps Script. He holds an engineering degree in Computer Science (I.I.T.) and is the first professional blogger in India. He is the developer of Mail Merge for Gmail and Document Studio. Read more on Lifehacker and YourStory

Get in touch

Google Add-ons

Do more with your Gmail and GSuite account

We build bespoke solutions that use the capabilities and the features of Google Workspace for automating business processes and driving work productivity.

  1. Mail Merge with Attachments
    Send personalized email to your Google Contact with a Google Sheet and Gmail
  2. Save Emails and Attachments
    Download email messages and file attachments from Gmail to your Google Drive
  3. Google Forms Email Notifications
    Send email notifications to multiple people when a new Google Form is submitted
  4. Document Studio
    Create beautiful pixel perfect documents merging data from Google Sheets and Google Forms
  5. Creator Studio for Google Slides
    Turn your Google Slides presentations into animated GIFs and videos for uploading to YouTube