A few easy steps can get your custom image on gravatar-enabled blogs.
That said, I reviewed this article and updated it as necessary to provide current information. Why not create your own Gravatar and see it appear on the Web sites you participate in?
If you read a lot of blogs, you’re probably already familiar with gravatars — custom images that represent certain commenters. These images are a kind of personal logo that identifies them and says something about their personality.
Here’s how gravatars work. A commenter creates an image suitable for a gravatar and uploads it to his account on gravatar.com. The gravatar is rated using pretty much the same ratings as the movie industry: G, PG, R, and X. These ratings are used by bloggers to set limits on the kinds of gravatars that appear on their sites — a gravatar with a G rating will appear everywhere while a gravatar with an X rating may not appear on many blogs at all.
Meanwhile, a blogger (like me) sets up her blog to enable it for gravatars. Then, when a commenter submits a comment, the blog’s gravatar plugin takes the commenter’s e-mail address (submitted in the comment form) and attempts to find a match at gravatar.com. If it finds a match, it displays the corresponding image. (The e-mail address is not used anywhere in the underlying page code.) If there’s no image on file, the plugin either displays nothing or displays a default image chosen by the blogger.
If you frequently participate in blogs by leaving comments for blog posts, you should consider creating a gravatar. Its easy and its free. Here’s how.
- Go to gravatar.com’s Signup Page.
- Enter your e-mail address in the box and click Signup. A message appears, telling you that an e-mail message has been sent to your account.
- Check your e-mail. You should find a message from Gravatar with the subject “Welcome to Gravatar.”
- Click the URL link in the e-mail message. Your browser opens and displays a message confirming that you have successfully activated your account.
- Enter a password for your account in each of the boxes that appear and click Set Password.
- If you want to receive a Gravatar newsletter, click the button in the next screen. Otherwise, click No Thanks.
- Use your favorite graphics application to create an image suitable for use as a gravatar. For best results, it should be 80×80 pixels in size and not include a border. (Keep in mind that it might be displayed at smaller sizes.)
- Save the image as a JPG, GIF, or PNG image with an Internet-friendly name (no spaces or weird characters).
- Use your Web browser to open your My Gravatars page on gravatar.com. (You may need to log in to your account.)
- Click the add a new one link.
- In the next screen, click My computer’s hard drive.
- In the next screen, click the Browse button. Then use the standard dialog that appears to locate, select and open the image file you created for your gravatar. The pathname appears in the File box.
- Click the Next button. The file is uploaded and appears in the rating screen.
- Click the appropriate button to apply a rating to the Gravatar. Don’t lie; this is important. And remember that for maximum exposure, it’s good to create a gravatar rated G or PG.
- Your newly created Gravatar appears in the My Gravatars screen. Click it to select it for your e-mail address. When prompted, click the Confirm button. Here’s what it might look like when you’re finished:
You can repeat steps 10 through 14 to add additional images. You can then change your gravatar by simply selecting one of the new images. As you’ll see your gravatar changes globally wherever it’s used when you change it.
From that point on, your gravatar should appear whenever you post a comment to a gravatar-enabled blog — like this one.
Do you have a gravatar now? Show it off by entering a brief comment on this post.
I’m wondering whether this will pick up my WP.com avatar now that they own Gravatar. This comment will help me to find out.
Andy Piper’s last blog post..Another Dogear Nation guest slot
Sure does work! Looks great. Glad to see you here!
Just testing out my gravatar, it keeps posting as the standard turquoise gravitar logo and not displaying my pic.
Thanks for the info and this site.
monique’s last blog post..Walk For Mike
I guess it works and it was just the other blogging site that won’t display it, but it displays everyone else’s. ???
Thanks!
monique’s last blog post..Walk For Mike
Glad it worked for you. Nice to see another face here.
I’ve actually created a Gravatar class if you click the link in my name. Loosely coupled and works like a dream – it also has a cache with an expiration date for the avatar – to save on loading times. It can merely load the avatar in locally.
Adam @ TalkPHP.com
Adam’s last blog post..Whats your favoirte editor?
Its cool man….Will this work for blogspot bloggers???
Ferrare’s last blog post: Rookie strived india for victory!!!!
Pretty cool guide. (^-^)d
Just testing
Thanks Maria for such a great website!
thanks for guiding me to the Gravatar world!
Love your Lynda.com tutorial.
cl
cls last blog post..Congratulations!
Thanks for guiding me to the Gravatar world!
Love your Lynda.com tutorial.
My second Gravatar but the first didn’t showed up :(
cl
cls last blog post..Congratulations!
Thanks for guiding me to the Gravatar world!
Love your Lynda.com tutorial.
cl
cl1s last blog post..Congratulations!
Hi,
I just created mine.
First I chose an image but the cropping square was too little for it. Then I chose one with less pixels, but it seems that it cropped it alot too….
So I kept the first one.
Thanks for guiding me…escelente tutorial
I had trouble trying to create a gravatar image and that’s how I landed on this site. For those having trouble cropping the image in gravatar itself, you can actually crop it by left clicking and dragging the yellow box. Initially I thought that the yellow box was a fixed width, so spent time resizing the image! Some clearer instructions on gravatar.com would be good.
Wareprise´s last blog post: Aviary – free online image editor similar to photoshop UI
Thanks, Maria!
Your guides are very well written and very clear. I’m thrilled to have discovered you on the web!
Swimturtle´s last blog post: An Overview of Google Reader
just testing
Testing a gravatar. If it doesn’t work, I’m back to the drawing board!
I think this works just seeing if it works on my auido boo account
works great!! love it, thanks!
Hi! Would you know how to make Gravatars work in Blogger-powered blogs? Thanks!
kixvix´s last blog post: Yo Mama Jokes, Book Covers
Thanks for the tutorial. Just checking to see if my gravatar works now…
Just wondering if this works, and how long will it take to display my gravatar picture :D
Wow, thank you very much for the tutorial
Gravatars are awesome!
Thanks for the tip
Thanks for the tip, just testing.
Just checking if it worked.
Carla: Worked great! Nice avatar. I really prefer photos of people over the trying-to-be-cute graphics.
Test, damn it!
Eek! It worked! Sorry about the delay; to prevent spam, I check EVERY comment that goes through.
Just doing a quick test!
Just one more time!
I wonder if the image is retroactive – in other words does it go back and add your photo to all the comments you’ve ever made previously?
Just found out it IS retroactive – at least on my own blog, my photo appears next to my old comments.
Excellent post Maria! I love how you guide us step-by-step with the appropriate images. It made it very easy for me to set-up my Gravatar. Thanks! :) ~ Mark
nice tutorial.. thanks for sharing..
testing my avatar… How do I set my image to link to my site?
I wish I could see my avatar :)
[...] love it if more commenters would sign up for Gravatars so their custom icons would appear beside their [...]
[...] go to Gravatar.com and get their own gravatars. And if you need help doing that, check out “How to Create a Gravatar” on Maria’s [...]
[...] Follow these steps to creat your own gravatar. [...]