Hide email links from spam bots - works with blogger.

Most of us are aware of spam bots, which scan the web and other media for email addresses to send unsolicited emails. So we avoid putting direct email addresses on the web.

Thinking about hiding, a few options come to mind. We can ;

• Type it like 'darkwingduck -at- superhero.com', giving the reader an idea about the real address 'darkwingduck@superhero.com'
• Use an image for the '@' character in html.
• Use a contact form instead of giving an email address.
• Use a script to build the address on the fly, which won't appear in the source files.

I've choosen the last option for my blog pages. I usually use a single command javascript to build the address, like ;

<script language='javascript'>
  document.write('foo' + '@' + 'bar.org');
</script>

This prints the address to the page on the fly. However this doesn't work in blogger somehow. So I've written a little script which will build the address after the page is completely loaded. This will work on nearly any web page including the blogger.

It can be placed anywhere on the page, so we don't have to mess with the template html, and simply put it on the layout using an html widget.

Before saving it, we need to change the 'user' and the 'domain.com' fields in the script to match our address. Then we can write our email address anywhere on the page, including html tags like 'mailto:' links, using the syntax :

!myemail!

This will get replaced by the script to match our email address. Here is an example :

Please write me at

<a href="mailto:!myemail!">!myemail!</a>

The script supports multiple email addresses and has an option for better performance. To make it perform better, you may wrap the area including emails with a span tag. Like :

<span id='myemailwrapper'>
    Please write me at
    <a href="mailto:!myemail!">!myemail!</a>
</span>

Note that if you only want to use your address in a link and not show it on the page, then you can just use :

<a href="#" onClick="SendMail('john','mywebsite.com');">
 Write me!
</a>

Here is the script :

function SendMail(User,Domain) {
 parent.location="mailto:" + User + "@" + Domain;
}

function RevealEmails() {
 DoReplace('user','domain.com','myemail');
}

function DoReplace(MailBox, MailDom, FieldName) {
 const TrySpan = true;
 var RootItem;
 if (TrySpan) RootItem = document.getElementById(FieldName + "wrapper");
 if (!RootItem) RootItem = document.body;
 RootItem.innerHTML = RootItem.innerHTML.replace(eval("/!" + FieldName + "!/gi"),MailBox + "@" + MailDom);
}

if (window.addEventListener) window.addEventListener("load", RevealEmails, false);
else if (window.attachEvent) window.attachEvent("onload", RevealEmails);
else {
 if (window.onload != null) {
  var oldOnload = window.onload;
  window.onload = function ( e ) {
   oldOnload( e );
   RevealEmails();
  }
 }
 else window.onload = RevealEmails;
}