UPDATE: We have a more updated blog post on how to add an Gravatar to your blog on our sister blog. (5/25/2017) – How To Add A Gravatar To Your WordPress Blog

Your Gravatar is an image that follows you from site to site appearing beside your name when you do things like comment or post on a blog. Avatars help identify your posts on blogs and web forums. It is a service by Automattic, and stores “avatar” or profile, images link to an email address on its servers. Once you upload an image on Gravatar server, it will display on any site that supports Gravatar across the Internet. Gravatar is a widely supported service used by many social media sites.

In WordPress, under Discussion Setting you can see Avatar options, which include Gravatar logo and “Mystery Man” along with other options. You can see sideways “G” in the Avatar option. This is the default Gravatar Logo from Gravatar and it’s not hosted on your server.

Sing up to Gravatar for an account and make sure that the email you used for Gravatar should be the same email as in your WordPress profile.

1. Sign up with your email address.
2. Upload your image to Gravatar.
3. Use your Gravatar email in your WordPress profile, because Gravatar works with your email address

Here is what a request to Gravatar might look like:

http://1.gravatar.com/avatar/d46a107ad0da7b2d43805854fea940d2?s=32&d=&r=G&forcedefault=1

Where
http://1.gravatar.com/avatar = Talking to Gravatar
d46a107ad0da7b2d43805854fea940d2 = This is the encrypted version of your email address.
32 = image to be 32×32 pixels.

Extending Gravatar’s functionality

So now we want to show image next to the comments, show image along with author’s post and want to extend certain
built-in functionality to other areas of your blog. Add this line of code

<?php echo get_avatar( $comment, 40 ); ?> in functions.php file

functions.php

<?php echo get_avatar( $comment, 40 ); ?> = Display your Gravatar image in comments on post, it’s a PHP function that gets your Gravatar image for WordPress. You can give it a size and design in a CSS file. Feel free to experiment with other style rules to get the avatar looking how you want.

/* =Gravatar
————————————————————– */
.gravatar {
float: right;
}

.gravatar img {
border: 2px solid #e3e3e3;
}

In order to get images next to the authors’ names on their post, copy the get_avatar() function into the single.php file because it controls the image that you want to shows up in individual blog posts. That way you Gravatar images will display next to the authors’ names on the posts and not just their comments.

single.php

<div class=”gravatar”>
<?php echo get_avatar( get_the_author_meta(‘user_email’), 40 ); ?>
</div>
<div class=”entry-content”>
<?php the_content(); ?>

For grabbing info about a post author, use get_the_author_meta() function in single.php file. Do some changes in CSS file to show up Gravatar image at the right-hand side of the post.

Reference: www.footballbabble.com, Head First WordPress by Jeff Siarto, www.library.thinkquest.org
Other Resources:
How to Display an Author List with Avatars in WordPress: Redux
How to Display an Author List with Avatars in WordPress Contributors Page
How To Display Author Photo In WordPress
How to: Add author’s gravatar in posts