Using Gravatar To Display Author Photo In WordPress Post and comments

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 if ( '' == $comment->comment_type ) : ?>
<li <?php comment_class(); ?> id="li-comment-<?php
comment_ID(); ?>">
<div id="comment-<?php comment_ID(); ?>">
<div>
<?php echo get_avatar( $comment, 40 ); ?>

<?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><!-- .postmetadata -->
<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 the CSS file to show up the Gravatar image at the right-hand side of the post.