Tip: Anonymous avatar for new Blogger threaded comments

Update Feb 2nd 2012: Blogger has updated the threaded comments, and it now includes an avatar for anonymous commenters by default. So this is now obsolete.

---

Previously I've told how to use anonymous "mystery man" avatar in the "old" commenting system, article here. But if you start using Blogger's new threaded commenting system, that old CSS won't display the mystery man anymore.

To make anonymous avatar work for the new commenting system, I had to use CSS3. Most browsers luckily support it now. Here's a simple CSS3 definition, that puts the mystery man back into his place. Add this to your template's CSS section (you can use Template Designer|Advanced|Add CSS):

.avatar-image-container img[src$="blogblog.com/img/blank.gif"] { width:36px;height:36px;
background:url(http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=36) no-repeat center center;
}

(double click code to select for copying) This tip works for non-dynamic views. You can use a custom avatar instead of the Gravatar's mystery man, uploaded to your Picasa web albums, for example.