How to Add a Custom WordPress Avatar

There is a How-to video at the end of the post.

An avatar is a way to help brand yourself. It is usually a logo or picture of yourself that shows up when you leave a comments in a blog post.

With WordPress, they give the ability to default a user’s Gravatar account when they comment with the associated email address.

Here is an example:

But if a person leaves a comment on your blog with an associated Gravatar account or mistypes the proper email account, a default WordPress avatar is used.

You, the site owner, have the ability to choose what WordPress avatar you want to default. This will show when a person without a custom avatar leaves a comment on your blog. This can be found on your Discussion Settings tab in the dashboard.

Custom WordPress Avatar

While having a choice of monster IDs and retro designs is nice, a site owner needs a custom WordPress avatar.

After creating a 80 x 80 pixel image, save it as a .png file. Upload it into your BlueHost cpanel image folder.

Go into Apprearance > Editor > functions.php file. Make a copy of it and paste it into notepad (just incase you make a mistake or you run into technical issues, you’ll have a copy of the original file).

Add this code:


add_filter( 'avatar_defaults', 'new_avatar' );
function new_avatar($avatar_defaults){
$new_avatar = get_stylesheet_directory_uri() . '/images/avatar_logo.png';
$avatar_defaults[$new_avatar] = "My Kick Ass Christine.biz Logo";
return $avatar_defaults;
}

below this code:

<?php
// Start the engine
require_once(TEMPLATEPATH.’/lib/init.php’);

Replace ‘/images/avatar_logo.png’ in the above code with your image file name.
Replace “My Kick Ass Christine.biz Logo” with your new avatar name (unless you want to keep it). ;)

So, what’s your custom WordPress avatar for your site look like? Leave me a link and I’ll come check it out.

Add a custom logo in your BlueHost cpanel today!
 

Did you enjoy this post? Sign up by email to receive my free blogging tips! No spam. I totally respect your privacy.

Print Friendly
About Christine McCarthy

Social Media Enthusiast, Tech Geek & Whole Foods Lovin' | Here to discuss Internet Marketing, Blogging, Social Media & Search Engine Optimization | Twitter: @christinebiz | Facebook: ChristineBiz

Comments

  1. It would be nice to display custom avatar. I prefer something meaningful avatar than to use blog logo or blog owner’s image because this will confuse readers. The author’s comment should be distinct and reader’s image should not be blog logo or author’s.
    Suresh Khanal recently posted..Why you don’t love KeywordLuvMy Profile

  2. Thanks for the tutorial. I created a custom avatar in the past, but eventually dropped it as it was too similar to the avatar tied to my comments. I’ll have to create a new one, and this post will come in handy since I will need to re-add the code to my theme.

    If you are active online, it is important to have your own avatar to help establish your brand online.
    Paul Salmon recently posted..5 Biggest Internet Marketing ScamsMy Profile

  3. I was just looking for this and I found your article in Blokube. Now I am going to implement this in my blog.
    First I have to create a custom avatar.

    Thanks for the article Christine :)
    Rojish recently posted..The Friday Coffee – Interview with Daniel Scocco of DailyBlogTipsMy Profile

  4. The first person who can write a plug-in to simplify this will have lots of installs. Always wondered but this is rather complex. What do you think Christine? Up for writing a plug-in? I would install it.

    Nik
    Nik recently posted..Hotel Chocolat to expand | BusinessMy Profile

  5. Hello Christine, Just curious as i am ready to install my new personal picture avatar.
    After going to functions.php:
    - Where more exactly do i have to introduce the line code?
    Before the code lines already there?
    Below the line codes already there?
    Please let me know.

    Thanks
    Chris Chisu recently posted..Photography, Rainier and dead treeMy Profile

  6. Hello Christine

    I had to rely at signing with Gravatar services in order to make my avatar available. I think it is because i am using a different WP theme and i was unable to find the line of code you have posted from your Genesis theme.
    But as long as it works is fine with me.
    And thank you for your tutorials.
    Chris Chisu recently posted..Photography, Rainier and dead treeMy Profile

    • Ah, you are talking about for comments to other people’s site. Gravatar is great and easy to implement. And if you reply to someone’s comments on your site it the Gravatar profile will be used.

      This tut will come in handy to set an avatar for those people who come to your site to comment and do not have a gravatar profile. It will replace the default Avatar settings and replace it with something more custom. If you would like you can email me your function.php file code and I can tell you where to implement it. Either drop it in the contact box or email me at christine @ christine [dot] biz.
      Christine McCarthy recently posted..Even Bloggers Need a Strategic Business PlanMy Profile

  7. i added my avatar and it works for comments…but i am interested in having the image showing up in my wordpress blog next to the “user” of the post. any suggestions?

  8. I have successfully finished by following your tutorial. Thnx 4 sharing.

  9. hi there,

    good post … i can see my custom avatar with the comment on the wordpress dashboard, but it still shows the default gravatar logo on my website … any ideas why?

    • try clearing your cache or in Chrome you can hit Ctrl+shift+N to open the incognito browser (doesn’t leave a cookie) to view . or try leaving a new comment. Let me know if that works.
      Christine McCarthy recently posted..5 Reasons Why Captain America Should Be a Blogger My Profile

      • hi – thanks for the quick reply Christine … clearing cache did not work – and icognito browser did not work either …

      • hi Christine,

        i am not a code guy, but i found the fix.

        in addition to your code (which works perfectly) one has to add the following in the functions.php file:

        there should be an existing line of code that says:

        <?php echo get_avatar($comment, $size='65', $default='’); ?>

        you have to replace with the url of where your image is stored, otherwise your theme will still grab the gravatar instead of your custom avatar:

        do this, and the custom avatar shows up on your website.

        thanks again

        • I had to go check mine. LOL.

          I have:
          add_filter( ‘avatar_defaults’, ‘new_avatar’ );
          function new_avatar($avatar_defaults){
          $new_avatar = get_stylesheet_directory_uri() . ‘/images/avatar_logo.png’;
          $avatar_defaults[$new_avatar] = “My Kick Ass Christine.biz Logo”;
          return $avatar_defaults;
          }

          where by ‘/images/avatar_logo.png’ is where my logo is stored w/ my hosting co BlueHost.

          But didn’t have the line you mentioned. So Thank you for the update. I am sure many people will benefit from it. For not being a code guy…that was pretty good. ;)
          Christine McCarthy recently posted..Hit “Send” too soon? How to retract Gmail messagesMy Profile

  10. Christine,
    I am using Headway, which gets cranky during php modifications. Before I deleted your code after numerous tries, I was able to get everything but the actual logo image on the WP discussion settings page. Do you mind helping?

    lovelinks.freefringes.com

    Thank you!
    Erica
    Erica M recently posted..lovelinks #31 is openMy Profile

  11. Hi there…thanks for the informative video…I was unable to complete this successfully as I am new to wordpress and I uploaded a theme from cyberchimps and it doens’t work like that plus I have hosting at godaddy…any words of wisdom you could pardon for this newbie? Thanks in advance.
    Jaime recently posted..The SEOPressor PluginMy Profile

  12. I used this in my blog… you can check this out: http://ramzkie.com/author/admin/
    Ramzkie recently posted..Sinulog 2012 List of WinnersMy Profile

  13. Nelly Grey says:

    Easy and simple steps to follow for a Custom Gravatar! Thanks Kristine :)
    Nelly Grey recently posted..hydrocodone acetaminophen 5 500My Profile

  14. Bookmarked :p
    I implemented the changes but didn’t create avatar.
    Thanks if it works. :)

  15. I found this article through google and it helped me lot to show custom avatar on site. Thanks again for this wonderful article.
    Dailyblogshout recently posted..5 Plugins To Make Comments In WordPressMy Profile

  16. Hi Christine! Thanks for this post. I added my new avatar. Very easy instructions.
    I’m wondering if you know how to add 3 or 4 avatars so they alternate?

  17. guideseeq says:

    Why not to use avatar plugin and get the avatar image upload feature in the edit profile section of WordPress.

  18. Oh hai there lady! I came across this when I was trying to figure out a better commenting system. I’ve been using disqus and it’s not working for a lot of people.

    What comment system (plugins) do you have installed? Halp. :)
    Calee (@chimes) recently posted..Why I’m not a Mom at the Ripe Old Age of 27.My Profile

  19. I don’t have a functions.php file :(

    • I found it. They changed the name to “Theme Functions”. So do I add the code at the top of the html? or the bottom?

  20. I can’t find code in my php can you please check this http://whatsnewtalk.com/wp-content/uploads/functions.txt
    I uploaded my image to /images/login_page_logo.png
    Thanks
    Dargson recently posted..How to Install Arch LinuxMy Profile

  21. I was wondering how to use a custom gravatar. Thanks to you for showing me a simple way to do it!
    Mukesh Dutta recently posted..3 Simple Yet Unique Website Ideas For Free! (Part-3)My Profile

Speak Your Mind

*

CommentLuv badge