Give your web presence a more personal identity

Photos on WordPress with Gravatar
Identicon quilt

Not a day goes by that I don’t run across a fantastic blog built or hosted on WordPress that looks gorgeous–they do an excellent job of making this pretty easy to accomplish.

but

Invariably the blog’s author has a generic avatar (blech!) instead of a nice, warm and humanizing photo of their lovely face.

Or, perhaps, as a user, you’ve always wondered how some people qualified to have their photo included with their comment while you were left as an anonymous looking “mystery person” or a randomized identicon, monster, or even an 8-bit pixelated blob? The secret the others know will be revealed momentarily.

Which would you prefer?

A face on the internet could love
Identicon: A face only the internet could love
Chris Aldrich
Chris:  a face only a mother could love
An example of a fantastic blog covering the publishing space, yet the author doesn't seem to know how to do his own avatar properly.
An example of a fantastic blog covering the publishing space, yet after 11,476 articles, the author can’t get his photo to show up.

Somehow, knowing how to replace that dreadful randomized block with an actual photo is too hard or too complicated. Why? In part, it’s because WordPress separated out this functionality as a decentralized service called Gravatar, which stands for Globally Recognized Avatar. In some sense this is an awesome idea because then people everywhere (and not just on WordPress) can use the Gravatar service to change their photo across thousands of websites at once. Unfortunately it’s not always clear that one needs to add their name, email address, and photo to Gravatar in order for the avatars to be populated properly on WordPress related sites.

(Suggestion for WordPress: Maybe the UI within the user account section could include a line about Gravatars?)

So instead of trying to write out the details for the third time this week, I thought I’d write it once here with a bit more detail and then point people to it for the future.

Another quick example

Can you guess which user is the blog's author? Can you guess which user is the blog’s author in the screencapture?

The correct answer is Anand Sarwate, the second commenter in the list. While Anand’s avatar seems almost custom made for a blog on randomness and information theory, it would be more inviting if he used a photo instead.

How to fix the default avatar problem

What is Gravatar?

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, so why not on any site?

Gravatar.com

Need some additional motivation? Watch this short video:

Step 1: Get a Gravatar Account

If you’ve already got a WordPress.com account, this step is easy. Because the same corporate parent built both WordPress and Gravatar, if you have an account on one, you automattically have an account on the other which uses the same login information. You just need to log into Gravatar.com with your WordPress username and password.

If you don’t have a WordPress.com account or even a blog, but just want your photo to show up when you comment on WordPress and other Gravatar enabled blogs, then just sign up for an account at Gravatar.com. When you comment on a blog, it’ll ask for your email address and it will use that to pull in the photo to which it’s linked.

Step 2: Add an email address

Log into your Gravatar account. Choose an email address you want to modify: you’ll have at least the default you signed up with or you can add additional email addresses.

Step 3: Add a photo to go with that email address

Upload as many photos as you’d like into the account. Then for each of the email addresses you’ve got, associate each one with at least one of your photos.

Example: In the commenters’ avatars shown above, Anand was almost there. He already had a Gravatar account, he just hadn’t added any photos.

Step 4: Fill out the rest of your social profile

Optionally you can additional social details like a short bio, your other social media presences, and even one or more websites or blogs that you own.

Step 5: Repeat

You can add as many emails and photos as you’d like. By linking different photos to different email addresses, you’ll be able to change your photo identity based on the email “key” you plug into sites later.

If you get tired of one photo, just upload another and make it the default photo for the email addresses you want it to change for. All sites using Gravatar will update your avatar for use in the future.

Step 6: Use your email address on your WordPress account

Now, go back to the user profile section on your blog, which is usually located at http://www.YOURSITE.com/wp-admin/users.php.

WordPress screenshot of admin panel for user information.
WordPress screenshot of admin panel for user information.

In the field for the email, input (one of) the email(s) you used in Gravatar that’s linked to a photo.

Don’t worry, the system won’t show your email and it will remain private–WordPress and Gravatar simply use it as a common “key” to serve up the right photo and metadata from Gravatar to the WordPress site.

Once you’ve clicked save, your new avatar should show up in the list of users. More importantly it’ll now show up in all of the WordPress elements (like most author bio blocks and in comments) that appear on your site.

Administrator Caveats

WordPress themes need to be Gravatar enabled to be able to use this functionality, but in practice, most of them do, particularly for comments sections. If yours isn’t, then you can usually add it with some simple code.

In the WordPress admin interface one can go to Settings>>Discussion and enable View people's profiles when you mouse over their Gravatars under the heading “Gravatar Hovercards” to enable people to see more information about you and the commenters on your blog (presuming the comment section of your theme is Gravatar enabled.)

Some WordPress users often have several user accounts that they use to administer their site. One might have a secure administrator account they only use for updates and upgrades, another personal account (author/editor admin level account which uses their name) for authoring posts, and another (author/editor admin level) account for making admin notice posts or commenting as a generic moderator. In these cases, you need to make sure that each of these accounts has an email address with an an associated Gravatar account with the same email and the desired photo linked to it. (One Gravatar account with multiple emails/photos will usually suffice, though they could be different.)

Example: In Nate’s case above, we showed that his photo didn’t show in the author bio box, and it doesn’t show up in some comments, but it does show up in other comments on his blog. This is because he uses at least two different user accounts: one for authoring posts and another for commenting. The user account he uses for some commenting has a linked Gravatar account with email and photo and the other does not.

One account doesn't have a Gravatar with a linked email and photo.
One account doesn’t have a Gravatar with a linked email and photo.

 

comments-yes
Another account does have a linked Gravatar account with linked email and photo.

More tips?

Want more information on how you can better own and manage your online identity? Visit IndieWeb.org: “A people-focused alternative to the ‘corporate web’.

TL;DR

To help beautify your web presence a bit, if you notice that your photo doesn’t show up in the author block or comments in your theme, you can (create and) use your WordPress.com username/password in an account on their sister site Gravatar.com. Uploading your preferred photo on Gravatar and linking it to an email will help to automatically populate your photo in both your site and other WordPress sites (in comments) across the web. To make it work on your site, just go to your user profile in your WordPress install and use the same email address in your user profile as your Gravatar account and the decentralized system will port your picture across automatically. If necessary, you can use multiple photos and multiple linked email addresses in your Gravatar account to vary your photos.

Syndicated copies to:

Author: Chris Aldrich

I'm a biomedical and electrical engineer with interests in information theory, complexity, evolution, genetics, signal processing, theoretical mathematics, and big history. I'm also a talent manager-producer-publisher in the entertainment industry with expertise in representation, distribution, finance, production, content delivery, and new media.

4 thoughts on “Give your web presence a more personal identity”

Please leave your comments, thoughts, or a simple reply.