I finally decided to spend a little bit of time to integrate Gravatar support into my blogs.  Admittedly I was spurred on by Matt’s posting which showed up on the WordPress dashboard.  I like the idea of seeing pictures of the folks commenting on my blog.

Matt’s Solution

Matt’s solution is to hard-code the Gravatar support right in the comment code of your theme.  Here’s his code:

<?php
if ( !empty( $comment->comment_author_email ) )
{
    $md5 = md5( $comment->comment_author_email );
    $default = urlencode( 'http://use.perl.org/images/pix.gif' );
    echo "<img style='float: right; margin-left: 10px;' src='http://www.gravatar.com/avatar.php?gravatar_id=$md5&amp;size=60&amp;default=$default' alt='' />"
}
?>

Plugin Solution

The Gravatar site offers a plugin for WordPress to integrate support into your themes.  I prefer this solution as it allows Gravatar support to be selectively enabled or disabled from the admin UI, which I’m a big fan of.  To use the plugin, add the following code above the call to the comment_text function:

<?php
if (function_exists("gravatar"))
{
    if ( !empty( $comment->comment_author_email) )
    {
        echo "<img style='float: right; margin-left: 10px;' src='";
        gravatar("G", 40, "http://use.perl.org/images/pix.gif");
        echo "' alt='' />";
    }
}
?>

You don’t want to urlencode the default image as it ends up getting over-encoded.  You’ll note in the above code that it is asking for 40×40 pixel images and only if they are G-rated.  Here is a description of the parameters to the gravatar function:

• Rating - Specifies the maximum rating of images to display.  Options are G, PG, R, and X.  If not specified, or specified as an empty string, all images will be displayed.
• Size - Specifies the size in pixels of the resulting image.
• Default - Specifies the default image to display if the requested email address has no associated gravatar, or if that gravatar has a rating higher than is allowed by the rating parameter.  I like Matt’s choice as it effectively displays no image at all in these cases.
• Border - Specifies the border color as a six-digit hex number.

Issues

Overall I’m pretty happy with this feature.  It took me far longer to get it working than I would have liked, partially due to some issues I found.  Here are the issues as well as some suggestions for improvement.

• Gravatar’s web site converts all email addresses to lowercase.  However, it is possible to use both upper- and lowercase characters in email addresses in WordPress.  The result is that gravatar may fail to find an image because the md5 hash doesn’t match the currently registered account for that user.  This is easily fixed, however, by using the strtolower function:
  md5(strtolower($comment->comment_author_email))
• The Gravatar WordPress plugin defines a single function that only works when displaying comments.  I would have preferred a function for getting the Gravatar URI based on a passed-in string.  This would allow the plugin to be used to display Gravatars in other locations.
• If there is no author email (not sure how this could occur, but Matt’s code tests for it) the plugin will pass an empty md5 hash.  This may not cause a problem, but it is less efficient.
• I wasn’t able to get the border option to work.  The way it is described on the Gravatar web site it looks like all you have to do is specify the border color.  This produced nothing at all for me.

My Modifications

I made a number of modifications to the Gravatar plugin to address the issues described above.

• I added a second function (get_gravatar_url) that, in addition to the parameters taken by the gravatar function, also takes the email address.
• The get_gravatar_url function calls the strtolower function on the email address before md5 hashing it.
• The gravatar function has been modified to call the get_gravatar_url function.
• I added admin UI so that a user can simply specify the desired maximum rating, image size, default image, and border color using the admin UI instead of having to modify the theme.  This allows the code added to the theme to be very simple: simply call the gravatar function with no parameters.

Note that while this is a pretty good solution, I found a better one that I use now.  I use Easy Gravatars by Dougal Campbell.  Check out Easy Gravatars version 1.2.1.

Resources

•   EasyGravatars-1.2.1.zip (6.2 KB, 85 hits)