Gravatar is a web based avatar service. You sign up, upload your avatar, and associate it with your email address(es). Now when you visit a site leveraging Gravatar and enter your email address (like comments on a blog), your avatar will automatically appear!

So today I decided to implement Gravatar on this blog, and here’s what I came up with.

If you are using this with Ruby on Rails, then add the code to you Application Helper (application_helper.rb). You may ommit the require line at the top, as this is already included in your Rails environment.

Generate A Gravatar URL

# This require is not needed for Rails.
require 'digest/md5'

# Returns a Gravatar URL associated with the email parameter.
# Gravatar Options:
# - rating: Can be one of G, PG, R or X. Default is X.
# - size: Size of the image. Default is 80px.
# - default: URL for fallback image if none is found or image exceeds rating.
def gravatar_url(email,gravatar_options={})
  grav_url = ''
  grav_url << "gravatar_id=#{}"
  grav_url << "&rating=#{gravatar_options[:rating]}" if gravatar_options[:rating]
  grav_url << "&size=#{gravatar_options[:size]}" if gravatar_options[:size]
  grav_url << "&default=#{gravatar_options[:default]}" if gravatar_options[:default]

All we have to do to get a Gravatar URL is:

=> ""

Use the @gravatar_options hash when you want to adjust the size, rating, or add a default URL for when there is no Gravatar.

gravatar_url('',{ :size => 20 })
=> ""

For more detail on the particulars of the options, see the online documentation.

Generate Gravatar HTML

If you want to generate an img tag from this, something like the following is what you want.

# Returns a Gravatar image tag associated with the email parameter.
def gravatar(email,gravatar_options={})
  # Set the img alt text.
  alt_text = 'Gravatar'
  # Sets the image sixe based on the gravatar_options.
  img_size = gravatar_options.include?(:size) ? gravatar_options[:size] : '80'
  "<img src=\"#{gravatar_url(email, gravatar_options)}\" alt=\"#{alt_text}\" height=\"#{img_size}\" width=\"#{img_size}\" />"

Now if we run our examples from above…

=> "<img src="" alt="Gravatar" height="80" width="80" />"


And with options…

gravatar('',{ :size => 20 })
=> "<img src="" alt="Gravatar" height="20" width="20" />"



Taking it further.

A good enhancement to this would be to cache the Gravatars locally, to speed up their load times. Look out for a future blog post on this.