Zach’s ugly mug (his face)

Zach Leatherman

Scare Your Visitors with this JavaScript Gravatar Plugin

08 Jan 2009 Zach Leatherman
About 340 words

See the Demo

Download the Source Code

Tournology Blog Comment Form

Here’s a use case. An unregistered visitor visits your blog, and decides that your content is so good that it merits a comment! Congratulations, you’ve fooled them! Now you can twply their account details for $1200 on Sitepoint! Just kidding. But generally, when you visit a blog’s commenting section (such as the Tournology Blog shown above), you’ll see a simple form to authenticate you’re not a spammer, generally including (among other things) an e-mail address field.

Tournology Blog Comment Form With Gravatar

Well, since they’re typing their e-mail address, wouldn’t it be cool if we could show them their gravatar right there, inline with the blog comment form? Well, that’s now possible with my new JavaScript Gravatar Plugin! It doesn’t have any server side language dependencies.

Gravatar Signup Page

Hell, could even use this to improve the user experience of registering your e-mail account. Right now it does a full page refresh and doesn’t even show you a preview!

See the Demo

Download the Source Code


Licensed under the WTFPL, as highly recommended by Isaac Schleuter (see discussion).

JavaScript Dependencies:

  • Requires jQuery (Feel free to port and post a link!)
  • Requires md5.js

Example Usage:

Easiest form, onblur of email text input field:

$('#emailTextField').blur(function(event) {

Showing all options, again onblur of email text input field.

$('#email').blur(function(event) {
    $('body').append($.gravatar($(this).val(), {
        // integer size: between 1 and 512, default 80 (in pixels)
        size: 200,
        // maximum rating (in order of raunchiness, least to most): g (default), pg, r, x
        rating: 'pg',
        // url to define a default image (can also be one of: identicon, monsterid, wavatar)
        image: 'identicon'

Update: This script has been moved to Github.


➡ Load Disqus to Leave a Comment ⬅

hey i want a downloadable version of alarmd

so we can use our own computer songs

and not be dependent on the internet (sometimes internet goes down)


Zach Leatherman

09 Jan 2009 at 06:02AM

Added this to the official jQuery plugin repository:

Zach Leatherman

09 Jan 2009 at 06:08AM

Well, it's certainly nice to see that someone reads my posts.

If I ever get bored, I might look at porting to AIR. Or if Gears ever adds file access. But, generally these things are managed on the Google Code page.

But you don't have it set up on this blog! I wanted to see it in action besides the demo.

This is very cool! :)

This plugin is really cool i scared the hell out of some people with it on my wordpress blog.