Simple Email Obfuscator for Middleman

Markdown natively supports mail obfuscation for emails put in angular brackets. However, if you are using a different markup format (most notably Textile), you do not have any specific support.

To reduce the risk of emails being harvested from my website, I defined the following function in the helpers section of my config.rb file of my MiddlemanApp websites.

def mailto email="", string="contact me"
  comp = email.split("@")

  # process string, if it is an email address
  if string.include?("@") then
    string_comp = string.split("@")

    string = "<script>a = [\"#{string_comp[1].gsub('.', " dot ")}\", \"#{string_comp[0]}\"]; document.write(a[1] + \" at \" + a[0]);</script><noscript>activate javascript to view email</noscript>"

  %|<a href="my email when you click" rel="nofollow"
       onclick="str1='#{comp[0]}';str2='#{comp[1]}';this.href='mailto:' + str1 + '@' + str2">#{string}</a>|

Download the snippet, if you want: mail_to.rb.

Usage is pretty simple:

  • First argument is the email
  • Second argument is the text to show on the page

For instance:

<%= mailto "", "send me an mail" %>

generates a link in which the email address is split into name and domain and built using JavaScript when the user clicks on the link:

<a href="my email when you click" rel="nofollow" onclick="str1='email';str2='';this.href='mailto:' + str1 + '@' + str2">contact me</a>

The script takes also care of obfuscating the email address, if it passes as the second argument, by replacing . with dot and @ with at.


<%= mailto "", "" %>


<a href="my email when you click" rel="nofollow" onclick="str1='email';str2='';this.href='mailto:' + str1 + '@' + str2">email at example dot com</a>

This might not be the strongest obfuscator available, but it simple and based on a rather effective strategy. See, e.g., Effective method to hide email from spam bots.

… and if you are not happy with it, as long as you use the mailto function consistently in your website, upgrading to a stronger obfuscator becomes a matter of replacing the code above.

Get in touch