How to change default avatar in WordPress 2.5+
An avatar or Gravatar (Globaly Recognised Avatar) is a small image that appears next to your comment on any posts. It s your profile picture. It will appears any time you leave a comment on a blog or forum. Here s a screenshot of some comments taken on my site:
How to use Gravatar on your site
The avatar feature is by default supported in WordPress 2.5+. Log into WordPress and click Settings then Discussion. Scroll down to the bottom of the page to Avatar Display and select Show avatars. Click Save changes. This will turn on avatars on your site.
If you don t have a Gravatar yet, you will need to create one here . When you sign up to Gravatar, enter the email address you usually use to leave comments on sites and forum.
Change default avatar
If you open the default WordPress theme and open comment.php (/wp-content/themes/default/) in a text editor you can see this line:
1 | <?php echo get_avatar( $comment, 32 ); ?> |
This code displays the gravatar of the commenter on your posts. 32′ is the size of your image in pixels.
If commenter didn t sign up to Gravatar, the default avatar will be displayed. Here s an example:
Now let s see how to change the default avatar by your own image. In my case, I chose to use my logo as my default avatar (good for branding). First, create an image 32×32 and save it into your image folder (e.g. /wp-content/themes/default/images/). Now change the default code line above by this one:
1 2 3 4 | <?php $urlHome = get_option('home'); echo get_avatar( $comment, $size='32', $default = $urlHome . '/wp-content/themes/default/images/avatar.jpg' ); ?> |
The first line will get the domain name url of your site (e.g. http://yoursite.com). The second one ($default) will retrieve the avatar image from your folder image. Change the url path to your image in the line above (/wp-content/themes/default/images/avatar.jpg).
And now a full example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>"> <?php $urlHome = get_option('home'); echo get_avatar( $comment, $size='32', $default = $urlHome . '/wp-content/themes/default/images/avatar.jpg' ); ?> <cite><?php comment_author_link() ?></cite> Says: <?php if ($comment->comment_approved == '0') : ?> <em>Your comment is awaiting moderation.</em> <?php endif; ?> <small class="commentmetadata"><a href="#comment-<?php comment_ID() ?>" title=""> <?php comment_date('F jS, Y') ?> at <?php comment_time() ?></a> <?php edit_comment_link('edit',' ',''); ?></small> <?php comment_text() ?> </li> |
Style your avatar
Next step will be to style your avatar to make it look more like a photograph. Open style.css in your text editor or navigate to the dashboard and click Design then Theme Editor. Scroll down to the bottom of the page and select Stylesheet (style.css) in your right sidebar. This will open style.css in the theme editor. Find “.commentlist li .avatar” in your stylesheet. If it doesn t exist, add the code below after “.commentlist li”:
1 2 3 4 5 6 7 | .commentlist li .avatar { float: left; border: 1px solid #EEEEEE; padding: 2px; background: #FFFFFF; margin-right: 7px; } |
This will display the avatar on the left of the commenter name and add a border to it.
The end result:
Done!
Avatars should be enabled on your site now. But if you run into a problem, you can check the WordPress Gravatar documentation or leave me a comment and I will try to do my best to help you.
[tags]wordpress, gravatar, avatar, tutorial[/tags]
The Author
Want to become a guest author on this blog?
hew says:
16 Jul, 2008
Hey! Great Post! I might use this on my blog. Keep up the good work.
Rob says:
13 Aug, 2008
Thanks for this just what I was looking for!
Vegasmartin says:
19 Aug, 2008
Just signed up for gravat, so I want to see how this works.
PinaraNet says:
22 Aug, 2008
I just know even was 2 years blogging LOL.
sohbet says:
11 Oct, 2008
Thanks!
Free-PHP-Scriots says:
27 Oct, 2008
Just what I was looking for!
Tom Robertson says:
11 Nov, 2008
Realy informative post. Keep up the good work.
I happened to need his info, so thank you very much.
The present ideas blog says:
14 Nov, 2008
I didn t knew about gravat I will sign up.
Lots Of Freebies says:
14 Jan, 2009
I was pulling my hair out for ages trying to style that one little part but now I ve managed with your help.
Many Thanks.
jyon says:
25 Jan, 2009
Thanks!
study says:
8 Feb, 2009
excellent work
Amichai says:
12 Feb, 2009
Thanks for the great post. Trying out my new Gravatar
Ste Hitchen says:
9 Mar, 2009
great tip, just implemented it on my comic site. thanks a bunch!
Robert Dall says:
15 May, 2009
Great Article.
It worked like a charm!
Thanks a bunch!
Earningstep says:
23 May, 2009
great , i love your tips
tiffany and co says:
10 Jun, 2009
I greet with your points!
Hosting says:
16 Jun, 2009
verry nice thnx
hkdedicatedservers says:
18 Jun, 2009
great , i love your tips
boyama oyunlar says:
22 Jun, 2009
Thanks very nice
oyUn says:
23 Jun, 2009
Just signed up for gravat, so I want to see how this works.
lifeofgame says:
26 Jun, 2009
Nice!
Thanks for the help
sickmanport80 says:
27 Jun, 2009
thank you very much
this is i m looking for
abiazka says:
30 Jun, 2009
thanks for the awesome post … this is what i ve been looking for …
abiazka says:
30 Jun, 2009
just sign up … thanks
medyum says:
6 Jul, 2009
thank you very much
nice article
Jake Rocheleau says:
7 Jul, 2009
Perfect! I ve been trying to change that stupid-looking default picture on comments in WordPress, excellent article.
The SEO Blues says:
8 Jul, 2009
In order to change your gravatar , you just need to take your Gravatar code and add the image (new)URL right after the comma:
Default
Changed
Just it
korean fashion wholesale
wordpress themes says:
18 Jul, 2009
Thanks for the guide, i hope its still working on wordpress 2.8.1
wow says:
21 Jul, 2009
thanks for you to share . it is so useful for us
links of london says:
21 Jul, 2009
very good, thank you!
cold sores says:
21 Jul, 2009
thanks.I have been upgrade 2.7 to 2.8 ,I hope it s still useful
ehirler aras evden eve says:
22 Jul, 2009
great tip, just implemented it on my comic site. thanks a bunch!
medyum says:
22 Jul, 2009
thank you
nice post
ssk says:
23 Jul, 2009
Thanks for the guide, i hope its still working on wordpress 2.8.1
Drew says:
25 Jul, 2009
i thought it would have just been a matter of saving over the default image… obviously not so thanks for your help, finally got it working.
koxp says:
27 Jul, 2009
Thanks for this share !
Z mr tevler says:
28 Jul, 2009
Your article are very impressive. Thank you so much.
botox says:
29 Jul, 2009
Perfect! I ve been trying to change that stupid-looking default picture on comments in WordPress,bolgesel sayiflama.. excellent .article.
cheemzy says:
5 Aug, 2009
Nice, finally found what i ve been lookin …thanks a lot
rkenshin says:
8 Aug, 2009
thanks. will try it out!
4insure says:
17 Sep, 2009
I was pulling my hair out for ages trying to style that one little part but now I ve managed with your help.
OneMoreGadget says:
18 Sep, 2009
Very helpful post. Thanks for the tip. I also like the design of your site, very easy to follow. Thanks again.
OneMoreGadget says:
18 Sep, 2009
Does it automatically recognize your image? Or does it only pop up if you put in the right e-mail addy?
Jeremie Tisseau says:
20 Sep, 2009
…only popup if you put the right email.
In your Gravatar.com account, you can add as many email addresses as you wish and select a different image for each.
haber says:
23 Sep, 2009
very nice, but my website was done with joomla
thanks
Shelz says:
23 Sep, 2009
Testing on my avatar. It doesn t appear in my own blog.
Digitalmalay says:
5 Oct, 2009
I tested it, and works just fine.Thank you so much.
Skinfood says:
9 Oct, 2009
Very helpful post. Thanks for the tip. I also like the design of your site, very easy to follow. Thanks again.
Smith says:
20 Oct, 2009
Hi
It is the biggest secret revealed today.
I will change my avatar right now by this method.
Thanks
regards !
Smith
Printable Address Labels says:
28 Oct, 2009
Perfect! I ve been trying to change that stupid-looking default picture on comments in WordPress,bolgesel sayiflama.. excellent .article.
medyum says:
30 Oct, 2009
tnks for all
car2t says:
2 Nov, 2009
Thank you for sharing. Great!
medyum says:
4 Nov, 2009
Thank you very much for everything
medyum says:
6 Nov, 2009
perfect blog thaks for boarding
The Ska says:
15 Nov, 2009
Yah! i already tried using gravatar but i really don t want to see my face on my post. lol
Cristiane says:
16 Nov, 2009
Thanks! That is all I needed!
Fahim says:
1 Jan, 2010
Just testing my gravatar on your site..
Mary Frank says:
6 Jan, 2010
I have an avatar for my yahoo account, how do I get the same image as gravatar ?
Ryan says:
16 Jan, 2010
Thanks for this!Just what I needed.
Cleansing diet says:
23 Jan, 2010
Thanks for the great post. Trying out my new Gravatar
ehliyet s nav sonu lar says:
24 Jan, 2010
Yah! i already tried using gravatar but i really don t want to see my face on my post. lol
John says:
25 Jan, 2010
Hi there.
Great Article.
It worked like a charm!
Thanks a bunch!
John
Daniel says:
31 Jan, 2010
Thanks for the tips. Great article for us
Lenny says:
7 Feb, 2010
Found your blog on Ask and was so glad i did. That was a great read. I have a quick question.Is it alright if i send you an email???…
Bruno Javers says:
10 Feb, 2010
Hey, nice post. I just found this blog, but I will definitely visit regularly. Keep us updated.
vijay says:
18 Feb, 2010
The avatar feature is by default supported in WordPress 2.5+. Log into WordPress and click Settings then Discussion. Scroll down to the bottom of the page to Avatar Display and select Show avatars. Click Save changes. This will turn on avatars on your site
says:
6 Mar, 2010
Thank you very much Great post thanks for share this.
………………………………
zmir Haberleri says:
15 Mar, 2010
Thanks for this useful post.
mario oyunlar says:
16 Mar, 2010
Just signed up for gravat, so I want to see how this works..
Furniture Indonesia says:
30 Mar, 2010
i really like you blog. i learned a lot reading here today. Keep up good work. I will make sure i visit this blog daily
Samual Bettinson says:
3 Apr, 2010
Thankyou very much, I ve found this extremely useful!
Mauricio says:
20 Apr, 2010
Hello, I ve created the 32×32 image and inserted the code into my comment-template.php, but the image doesnt appear. It looks for a “http://mysite.com/wp-content/themes/themename/images/avatar.png?s=32″.
I think because of this “s=32″ it cant find my image!
Do you have any idea about how to solve this?
Thank you very much!
Mauricio says:
20 Apr, 2010
Sorry, my mistake… It worked perfectly!
Congratulations.
Regards.
livebbg says:
25 May, 2010
I love the theme you created. Very simple, clean, elegant. I would like to know, however, if it is possible to edit the theme colors from Green to a Royal Blue most of my site s other content is Royal Blue and after searching through the CSS files, I am as of yet unable to find the particular line that changes the text colors for all the H, and A on the theme .. reply would be appreciated
Jeeremie says:
25 May, 2010
What theme are you talking about? Oneroom? And, just wondering… why did you comment on this page?!
izmir says:
2 Jun, 2010
Thankyou very much, I ve found this extremely useful!
..
t l perde says:
24 Jun, 2010
Yah! i already tried using gravatar but i really don t want to see my face on my post
Magnolia Clare says:
2 Jul, 2010
Thanks for the tutorial however for some reason it didn t work in my template. I ended up having to make changes to my functions.php file instead, but it worked out okay and now I have a cute cupcake instead of the Mystery Man.
Thanks for making me think this was possible though; I was so sick of the standard avatars.
Magnolia.
indir says:
3 Jul, 2010
I was pulling my hair out for ages trying to style that one little part but now I ve managed with your help.
Evli says:
4 Jul, 2010
thanx very nice
technology says:
8 Jul, 2010
Just signed up for gravat, so I want to see how this works.
Filmdizi says:
12 Jul, 2010
Yah! i already tried using gravatar but i really don t want to see my face on my post
Aein says:
9 Aug, 2010
Thanks so much!
Lara Park says:
13 Aug, 2010
Good,
Thanks a lot …
Onaired says:
25 Aug, 2010
Great post buddy. I really appreciate the effort. Hope that would help lot others.
xat sohbet says:
26 Aug, 2010
Thank you all very good informations interesting love.
adige says:
27 Aug, 2010
thank you very much i like kreation
mario oyunu says:
3 Sep, 2010
thanks for good post.It is very useful
giydirme oyunlar says:
3 Sep, 2010
Thanks for making me think this was possible though; I was so sick of the standard avatars
mario oyunlar says:
24 Sep, 2010
interesting post. good article thanks admin.
ogame says:
7 Oct, 2010
obviously not so thanks for your help, finally got it working.
Greek Porn says:
22 Oct, 2010
You need to becareful what you edit in the PHP code because i made a small mistake of one little ” and then the whole site got bummed up!
netmola says:
1 Nov, 2010
thk u..
Pilates Hareketleri says:
13 Nov, 2010
Good Content Thanks…
hal y kama, temizlik says:
1 Dec, 2010
I love this site:)
ambalaj says:
9 Dec, 2010
worlpress Excellent waoow
DnD says:
23 Jan, 2011
I have my own avatar now. Thank you.
James says:
20 Feb, 2011
any way to get random default avatar?
thanks.
Calypso Bay says:
24 Feb, 2011
WordPress is taking over the world. It s the number 1 CMS
Riz says:
10 Mar, 2011
Hey nice article, i am using Grephene Theme for my wordpress blog, but there is always a border around pics in posts. how to get rid of it.
Zeth says:
17 Mar, 2011
Good stuff! WordPress is an amazing tool! Great blog - I like your stuff!
SeoBrazil says:
20 Mar, 2011
Good Content Thanks
Biga says:
6 Apr, 2011
Article is more helpful. Thanks for share that on internet.
izmir escort says:
30 Apr, 2011
Thank you for article very nice sharing
yeni m zikler says:
14 May, 2011
Thanks for this post. I follow your posts…
su deposu says:
7 Jun, 2011
blog, but there is always a border around pics in posts. how to get rid of it.
Jeeremie says:
7 Jun, 2011
You have to edit the stylesheet. Use the browser code inspector to find out which css class to edit.
Wahyu says:
16 Jun, 2011
Wow! Thanks! I search this tutorial. I can t change my avatar
Thanks anyway! Really nice tutorial…
shruti says:
23 Jun, 2011
just want to see my pic changed or not …
Hire Web Developers says:
12 Jul, 2011
Adding a new avatar image to the default wordpress avatar called mystery man was always a new bloggers problem. By this post we change the image. So nice tipes.
sohbet says:
3 Aug, 2011
good thanxs
Dani says:
5 Sep, 2011
Great, this is what i was looking for!
Pobers says:
5 Oct, 2011
Thak s a lot, it s work on my site.
perfect steps says:
1 Nov, 2011
Very good article, thanks.
site ekle says:
5 Jan, 2012
Enjoyed examining this, very good stuff, regards
bangladesh news says:
12 Jan, 2012
What i don t understood is in reality how you re now not actually a lot more well-favored than you may be now. You are very intelligent. You realize thus considerably relating to this matter, produced me individually imagine it from so many various angles. Its like men and women don t seem to be interested unless it s something to accomplish with Lady gaga! Your own stuffs nice. Always maintain it up!
erhan says:
14 Jan, 2012
Thak s a lot, it s work on my site.
OliveStreet says:
15 Jan, 2012
Thank you so much for this. Finally came across solution to the dreaded default Gravatar avatar after almost a day and half, countless searches, posting in WP.org ….
Thank you, thank you. I can now go to sleep!
lisin says:
19 Jan, 2012
nice info….thanks
Explorers Journal says:
30 Sep, 2012
I notice that some avatars are not showing in your theme as well. I have the shame problem after the update of wordpress. So if you find a sulotion about this please let me know!