Avatars, or the well known Gravatars, are tiny images, often called your online identity, picture, badge, logo, or graphic image which represent you and/or your blog. Some use photographs of their face or body, or a body part like an eye, nose, or hand. Others use pictures of animals, flowers, scenics, or graphic images. Many professional bloggers use their logo.
Many people like to see these graphic representatives of their blog next to their comments, or now, with the new addition of avatars and Gravatars to WordPress.com, in their WordPress Administration Dashboard listing of the top posts, My Comments comment follow panel, and on the Comments Panel, as well as within the comments of many WordPress Themes.
Adding Gravatars to WordPress and WordPress.com Blogs
When Automattic bought Gravatar, they updated the infrastructure to speed things up and updated the Gravatar WordPress Plugin.
Then Gravatars support was enabled for all WordPress.com users. Those with a Gravatar attached to their email will see their Gravatar image appearing on all WordPress.com blogs, as soon as they finish enabling all WordPress.com Themes.
WordPress.com bloggers can add an avatar image to their blog by going to the Users > Your Profile panel. In a box currently on the left side is where to upload your image. The image should be no bigger than 128 pixels, though 80 pixels square is the standard. The image must withstand “shrinkage” down to 16 pixels, the size that appears on the Administration Panels Dashboard.
If you would like to add Gravatars to your blog, begin by registering a Gravatar image on the Gravatars site by signing up and submitting an image. Then follow the user’s guide which includes how to enable Gravatars on your blogging platform or program.
WordPress users can use the Gravatar WordPress Plugin from the Gravatars site, or chose from the Easy Gravatars WordPress Plugin or WordPress Gravatar Plugin by Il Filosofo. Both have excellent features and customization.
How Do I Make My Avatar/Gravatar?
Your avatar or Gravatar comes in only one size when uploaded. Traditionally it is 80 pixels square, but Automattic has stated that they want to increase the base size to 128 pixels. The key to creating a useful avatar is that it must be “shrinkable”. It must have the ability to remain viable and visible down to its smallest size usage.
![]()
On most blogs, the comments area features an 80 pixels square image. On the WordPress.com Administration Panels, the image varies from 48 pixels on the My Comments panel, 32 pixels on the Comments Panel, then shrinks down to 16 pixels on the Top Posts list on the Dashboard Panel.
![]()
On the front page of the WordPress.com site, the avatar images are 128 pixels and 48 pixels for the top blog posts listings. On the Blogs of the Day on WordPress.com site which tracks the most popular blog posts and blogs on WordPress.com, the avatars for the most popular posts are 96 pixels square.
That’s a lot of flexibility for such a small image.
Here is an example of four sizes of my avatar for Lorelle on WordPress. The first one is 128 pixels, then 80 pixels, 32 pixels, and finally 16 pixels.




As you can see, the image is clear at 128 and 80 pixels, but the image quality drops to nothing as it gets smaller. Only the color is retained. This test makes me reconsider the avatar graphic, don’t you think? Then how often is my avatar going to be in the top 10 blog posts lists and the 16 pixel size used? Hmm?
Many use a flower or body part. Let’s take this photograph of a flower by my husband, Brent VanFossen, and run it through it’s shrinkage as an avatar.



There is enough contrast in the colors and shapes for the image to hold to the small size, though it looks like a button rather than a flower a the smallest size. High contrast between the foreground and background colors helps hold the image through the shrinkage process.
Using another photograph of an orangutan by Brent, let’s see how an animal image, especially a face, handles the reduction in size that an avatar undergoes.




The facial features are lost at the smallest size, but it does hold most of the way down. The sparkles in the eyes, called the catch light, keeps the focus on the eyes and facial recognition possible even at the smallest sizes.
Using a graphic, especially a simple, high color and tone contrast design, holds all the way down to the smallest 16 pixel size.



From these examples, it’s clear to see that an avatar image with good contrast between the background and the foreground subject, uncluttered and simple will reduce down better than a busy, dark image. An avatar image can be anything, but it must be shrinkable.
Related Articles
- JPG, PNG, or GIF - When and How to Use Different Web Graphic Formats
- Some Basic Tips for Web Design Graphic Elements
- WordPress Plugins for Images, Photographs, and Graphics
- Free Photos for Your Blog
- Asking a Key Question About Your Blog Brand
- Blog Branding: Bringing Touchy-feely Relationships to Blogs
- Blog Branding: Show the World You are an Expert
- Blogging Tips Book: Blog Branding and Identity
- Chris Garrett on Blog Branding

Site Search Tags: avatar, gravatar, wordpress tips, wordpressdotcom, wordpress.com, wordpresscom, blog brand, blog identity, graphics, images, photographs
Subscribe
Via Feedburner
Subscribe by Email
Copyright Lorelle VanFossen, and author of Blogging Tips, What Bloggers Won't Tell You About Blogging.









40 Comments
lorelle, with regards to the plugin, it says version 1.2, does it support 2.3 now?
i am using gravatars 2 plugin but would not hesitate to switch if there is an up to date official plugin for gravatars. don’t get me wrong, gravatars 2 is a great plugin to use, very simple and it is successfully integrated into my theme but i would definitely prefer something which is official.
Thank You for this know-how!
Thank you
Love that, really useful and informative.
Can wordpress.com gravatars now be seen in wordpress.org blogs, using those plugins?
I think that it is worth mentioning two alternatives to Gravatars - Wavatars and MonsterID. Both are very easy to integrate to a theme and I think have the primary advantage over Gravatars that they are generated and stored locally, so you arent dependent on the servers at Automattic (reliability and speed).
Hello Lorelle,
I am using a plugin that only show gravatar but my commentator seems not having an gravatar so it will only show the gravatar default image. how can i change to combine avatar and gravatar?
I host WP on my own domain and so I wanted a mixed solution, and I found it! I use Comvatars. It combines the best of all worlds. You can host your own avatars, use Gravatars or Favatars or all three! I choose all of them together and they work great. If the user doesn’t have a site-personal avatar it looks for a Gravatar, and if that fails it looks for the fav icon from their website. Lastly, if nothing can be found it uses an anoymous avatar from my unidentified section. I love it!
Good article, I found this to be true.
Very nifty. I’ll have to remember this for when I move my bloggy to wordpress in April.
Funny, cause I just installed Gravatars yesterday. I used to have them installed before, but after I changed themes I never added the feature.
@ Darran:
As for which version which Plugin supports, you’ll have to check the Plugin author’s blog for updated information.
jonathan hickman: There are no WordPress.org blogs. There is the WordPress blog program you can download from there and install on your own self-hosted site. Then you could use the various Plugins.
If you mean can the avatars used on WordPress.com blogs be seen through the Gravatars Plugins on non-WordPress.com blogs, I’m still waiting for an answer on that, but I believe so.
Aizat: There have been mention in the comments here of Plugins which will work with other avatar systems including Gravatars, so try those to get as many avatars as you can on your blog.
I tend to call self-hosted WP blogs “WordPress.org” blogs, to differentiate from wp.com blogs, although I know that’s not entirely accurate. Sorry about that.
I’ve now tried easy gravatar and haven’t had any luck getting WP.com avatars to show up. If anybody else has any better luck, let me know!
I believe that as long as your avatar/Gravatar lins back through the Gravatar service, your picture should show up on any Gravatar enabled blog or page.
Thanks for the info. Been trying to get gravatars to work for a while on my site. Hopefully with your information I’ll get it working
Thx for info .. it’s awesome!
I don’t know about the problem, but that in some wordpress (.org) blogs, gravatars don’t show up even though it’s enabled in their sites.
Nice ;D
gravatar should come integrated with wp.org ;D
Your step by step guide finally helped me get gravatars working for my site! So happy. WordPress tutes and the gravatar plugin readme didnt seem to do it for me. So a MASSIF thanks to you Lorelle!!
I’m fairly new into blogging and would like to enable avatars on my site. I installed the Easy Gravatar Plugin successfully. You mention in the post above that you can change your avatar by going to… “Users > Your Profile panel. In a box currently on the left side is where to upload your image.” I see no box on my WP admin. Where is this?
Ok… I see now that my image is in the GLOBAL (wordpress.com hosted) site. How can I make this work in my locally installed copy? Further, is there a way to opt-in users on my blog? I see that when I visit yours (again hosted at wp.com) there is a top iframe showing my credentials. Again, I’m new at this but learn quickly… thanks for any pointer. I like this feature.
@ osaez:
If your commenters have a Gravatar account, their image will appear in your comments when using a Gravatars Plugin. To make it work, I’m sure you’ve found the panel added by the Plugin by now. There is no way to “opt-in” blog users other than to provide them with a link to get their own.
I can’t get the plugin to work on my wp.org site. I have it installed and activated and they ask me to put the snipet of code to call it () in the comment loop. When I add it, all I get is a URL pasted on the page. I’m not sure where to place that code gravater is giving me. Any suggestions?
Hello,
to ask them ? Or is it a no-solution situation ?
I’ve just added my avatar a couple of days ago and I really really hate what it looks like in Netvibes now with the avatar. The FAQ say that you cannot suppress your avatar. Is it absolutely true ? Because I’m currently contemplating starting a new blog to avoid this inconvenience …
Would you have a sugestion about that ? Should I mail the support (as soon as it re-opens …
Thanks for your input.
@ Catherine:
The issue you have is with Netvibes not WordPress or WordPress.com or even Gravatar. Change your avatar image if you don’t like it. I can’t help you with Netvibes. For help with how it works in WordPress and WordPress.com, see the appropriate forums or the Gravatars site.
Hello Lorelle,
thanks for the answer. Yet, my question was really about supressing the avatar in WordPress.com. I do not want to change it, I want it to disappear and things to go back as they worked before. I think I shall contact the support to ask them about that …
Thanks again.
Well written entry. Thanks!
is there a plugin to display avatrs for different posters in a blog?
@ odiaseo:
I’ve listed specific Gravatar Plugins in the article. Is there something more that you need to do with these? I’m not sure I understand what you are asking for.
I NEED HELP when i upload a pic and press send to editor, i want to move it around to the bottom, but when i click on it and move it, it wont go to the right place, I’ve looked in the FAQ but I can’t find a thing PLEASE HELP1
@ smartie495:
Delete the image from the Rich Text Editor. Move your cursor to the place where you want the image to go. Using the image uploader, add the image at that point. Then click on the image to align it within your post text. You can learn more about this in WordPress.com Blog Bling: Decorating Your WordPress.com Blog.
Gracias por el dato!!! ya lo integre en mi blog.
Thanks for a tips!!
Simple iconic logos look great as Gravatars…
ok. Lets see if this works
umm, i’ve tried uploading an image i saved to my computer..But it’s not showing up on my dashboard or next to my name
what am i doing wrong?
@ t1ckle:
It can take some time, maybe a few hours, for the server to update itself so your Gravatar is visible across the web. If you continue to have problems, visit the WordPress.com Support Forum for help, if you are using WordPress.com. Visit the WordPress Support Forum if you are using the full version of WordPress.
Now for the real question: How does one add an avatar to one’s forum profile on wordpress.org?
@ Edward:
Actually, that’s a very good question. I’m not sure I have the answer. I used to have an avatar on the WordPress Support Forum and it was indeed there when I checked my profile. I tried to edit my profile to see if I could set the avatar there, and suddenly, my avatar was gone. So I went to Gravatar.com from that page and I was already signed in with no avatar shown. Since I didn’t have an avatar associated with the email address of the support forums, I assumed that I was automatically still logged in through WordPress.org. So I’ve added a new avatar associated with that email address and we’ll wait and see if it appears on the WordPress.org forums.
Not the answer you wanted, but a good one. Stay tuned for an answer.
Thanks for the info, works like a charm!
10 Trackbacks/Pingbacks
[...] Lorelle, nos muestra en sencillos pasos, como integrar avatar y gravatar en nuestro blog, ya sea para WordPress Hosteado o WordPress.com. En lo personal se me hacen muy agradables. [...]
[...] Lorelle van Fossen did the blogosphere a great service in promoting Gravatars. These are avatars that show up whenever you leave your email in a comment. I have these installed on my blog so why not go get your free gravatar and start seeing it show up wherever your safari takes you? [...]
[...] accordingly, but a blog is not a place you can store your notes to come back to and remember how to add a Gravatar to your blog. There are bookmarking services for [...]
[...] A nice article by Lorelle, with lots of links and examples of good and poor contrast in small images - Lorelle on Adding Avatars and Gravatars [...]
[...] accordingly, but a blog is not a place you can store your notes to come back to and remember how to add a Gravatar to your blog. There are bookmarking services for [...]
[...] 2.5+: How To Add Gravatar to Your WordPress Theme and Adding Avatars and Gravatars to Your WordPress and WordPress.com Blog will help you learn more about the new Gravatar system now included in WordPress [...]
[...] you just read this whole article and have no clue what a Gravatar is, I suggest you read this one first by Lorelle on WordPress. It goes over the basics of how to get your own Gravatar by signing up at [...]
[...] your gravitar look good on this site, make sure it looks good at 65 pixels. My friend Lorelle has a fantastic post on what makes a good gravitar that you might want to read when trying to figure out what image to [...]
[...] Adding Avatars and Gravatars to Your WordPress and WordPress.com Blog, I discuss how to create an avatar for Gravatar and add it to your WordPress blog, including [...]
[...] already present in your theme. If you’d like to make your own Gravatar, I suggest you read this article and scroll to the “How Do I Make My Avatar/Gravatar?” section. Subscribe to RSS By: [...]
Post a Comment