Skip to content

Instantly share code, notes, and snippets.

@patrickfav
Last active January 7, 2024 19:39
Show Gist options
  • Save patrickfav/3f9127e25dd6538f0d682b89cbfaefd9 to your computer and use it in GitHub Desktop.
Save patrickfav/3f9127e25dd6538f0d682b89cbfaefd9 to your computer and use it in GitHub Desktop.
A Liquid Filter for obfuscating an Email Address (can be used with Jekyll aswell).

In Jekyll set a variable for the mail, e.g. in the _config.yml

email: name@mail.com

then use it in your page

Reach me under:	{{ site.email | mailObfuscate }}

which will generate the following HTML

<a href="#" data-contact="bmFtZUBtYWlsLmNvbQ== " target="_blank" onfocus="this.href = 'mailto:' + atob(this.dataset.contact)">    
    <script type="text/javascript">document.write(atob("bmFtZUBtYWlsLmNvbQ== "));</script>
</a>

This uses some simple obfuscation techniques of url encode and base64 encode the mail and use JS to support the link and write it to HTML programmatically. This is certainly not bulletproof, but a good shield and in combination with a good spam filter this will fix your problem with mail crawlers.

These techniques are partly from http://techblog.tilllate.com/2008/07/20/ten-methods-to-obfuscate-e-mail-addresses-compared/

require "base64"
require "uri"
module ObfuscateMailAddress
def mailObfuscate(input)
base64Mail = Base64.strict_encode64(Addressable::URI.encode(input))
# See http://techblog.tilllate.com/2008/07/20/ten-methods-to-obfuscate-e-mail-addresses-compared/
output = "<a href=\"#\" "
output += "data-contact=\"#{base64Mail}\" target=\"_blank\" "
output += "onfocus=\"this.href = 'mailto:' + atob(this.dataset.contact)\">"
output += "<script type=\"text/javascript\">document.write(atob(\"#{base64Mail}\"));</script></a>"
return output
end
end
Liquid::Template.register_filter(ObfuscateMailAddress)
@achilleus68
Copy link

achilleus68 commented Apr 12, 2019

I'm rather new with Jekyll and Liquid. How can I pass text that can be used as linktext? E.g.
in
<a href="foo@bar.com>foobar</a>

I would like to pass foo@bar.com as input and foobar as linktext

@yasarhabib
Copy link

I'd like to know this as well. How do you actually use this code?

@dkreeft
Copy link

dkreeft commented Aug 7, 2020

Here is how you do it:

  1. Put mail_obfuscate.rb in a folder named _plugins (create it if it does not exist). Every script in this folder will be loaded before the rest of the plugins.
  2. Use {{ site.email | mailObfuscate }} wherever you would like to have your email.

It did not work for me at first. It turns out the github-pages gem is causing Jekyll to run in safe mode. You would have to replace this gem with jekyll in order for it to work.

@tim-taylor
Copy link

Thanks for this nice simple approach, which works nicely in my Jekyll project. However, the use of URI::encode is now deprecated, and generates a warning mail_obfuscate.rb:6: warning: URI.escape is obsolete. I'm not a Ruby programmer - I tried using URI.encode_www_form_component() as suggested on some other sites, but this resulted in the "@" of the email address appearing on the page as "%20". Is there a simple way to fix this so that it runs without warnings?

@digitigradeit
Copy link

The error mentioned above by @tim-taylor can be resolved by changing line #6 from

base64Mail = Base64.strict_encode64(URI::encode(input))

to

base64Mail = Base64.strict_encode64(Addressable::URI.encode(input))

@tim-taylor
Copy link

Thanks very much @digitigradeit! That does indeed solve the problem.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment