How to Change Default Anonymous Avatar in Blogger Comments

at May 06, 2012
Earlier, you've seen how you can change the size of the avatars in blogger comments and now I will show you how to change or customize the default avatar of anonymous commenters or Blogger users with no picture on their profiles. While Blogger announced the new threaded commenting system, we can still customize it by adding a jQuery plugin to our template and then replace the default anonymous avatar that can be found on this address: http://img1.blogblog.com/img/anon36.png and the one for blogger users: http://img2.blogblog.com/img/b36-rounded.png ...with our own.

anonymous, default avatar, blogger blogspot

Replace the Default Anonymous Avatar on Blogger Comments


Step 1. Go to Dashboard - Template - click on the Edit HTML button


...click anywhere inside the code area and open the template search box by pressing the CTRL + F keys

Step 2. Type or paste this code in the search box, then hit Enter to find it:
</body>
Step 3. Just above the </body> tag, add the following code:
<script src='http://code.jquery.com/jquery-latest.js'/>
<script>
$(&quot;img[src=&#39;http://img1.blogblog.com/img/anon36.png&#39;]&quot;)
.attr(&#39;src&#39;, &#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiL_yFp9yPyxf7T8rXiBi1KSXo6CR8j7caiX-E7pRrG2R3MhFA92AG4_bcaBVFD8jRE439qZd3WIFXolEZoVheVTtWKdCAOWGJ400fOOFnZPbIzWbZPIGRLOTYZghVzYpFqOqLoMCrpJOk/s1600/default_avatar.gif&#39;)
.ssyby(&#39;blank&#39;)
</script>
<script src='http://code.jquery.com/jquery-latest.js'/>
<script>
$(&quot;img[src=&#39;http://img2.blogblog.com/img/b36-rounded.png&#39;]&quot;)
.attr(&#39;src&#39;, &#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbbtAnfG7bITB15KEzZtA0wXdQly6gRDYYoWjqtF57jJVzokPvi-vhG_uQB8bBgl7d09JvKU0nboJQUMelSE25j4ON6lrHHuptV7w2O1tMtkBC97n6EjCW2rnqI1GfyUcNxl0EcPGR56k/s1600/blogger-user.png&#39;)
.ssyby(&#39;blank&#39;)
</script>
Step 4. Save the changes by clicking on the Save Template button

Changing the default avatar

For Anonymous users: Replace the code in red with your image address
For Blogger users: Replace the URL in blue with your own.

You can choose an avatar from here and then copy the url of it:


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiL_yFp9yPyxf7T8rXiBi1KSXo6CR8j7caiX-E7pRrG2R3MhFA92AG4_bcaBVFD8jRE439qZd3WIFXolEZoVheVTtWKdCAOWGJ400fOOFnZPbIzWbZPIGRLOTYZghVzYpFqOqLoMCrpJOk/s200/default_avatar.gif


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAW7TiBEPjWuARAldPCw4OPGH46joaoMIBQo51HoRnbtEQWSd5mt_N7b37Bs2k5GxeQtsdBbUPJVLMT7oZaHikCoGFC2X-680Je-RTrz3q9_26ncKMeQls5yFNhhxJu6UUXcXGyxxl6S0/s1600/facebook.gif


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEmmxTLOD-DnXR6GcoLMakxuCZBCVtasvLMFKA2Q1FW626D0jFvbrslUO4Tju4YBpI5lgGE6tE0bClqHQxPxkjCgMUtdZtEMcF_UHOzAHT-sy-TfvLcjbEBT-8lG1mYEhLoIhuLMhBXTw/s1600/anonymous3.png



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2OClL-ya8X5U-stZ4Wa8sgdg96sg2wam2QlbV-i4wJU7v4lS37hHBX4Wx-QFt1-cy_09RO5agnFJyTXqjpgt1lwN0LmlJbmZhwEtvakS9wZgUCwXljTNZZoRLEl0HMPdLqUSUkV7Qb7ng/s1600/blogger-user.png

That's it! If you found this trick useful, please consider sharing it.
Tags: , ,

Comments/disqusion
51 comments

  1. says:

    thanks

  2. says:

    Hi,
    Interesting article for add your own avatar on blogger. I like it.

    Please, comment on my blog!!!!
    http://sunilseoservices.blogspot.in/

  3. says:

    Hi,
    Niche post, I like your interesting post!!!!

    http://sunilseoservices.blogspot.in/

  4. says:

    THANK YOU!!! :D

  5. says:

    You're welcome :)

  6. says:

    Thanks.. :-)

  7. says:

    Nice trick,thank you.

  8. says:

    FINALLY a way it works! I have been trying the whole day with LOTS of different tutorials, none of them worked! I.LOVE.YOU.

  9. says:

    but how do i set the comments so when an user gets to show their own picture from blogger? :( mine as well. it only shows as that ugly orange B

  10. says:

    Thanks for the tutorial.

    how can i change default blog owner display name in comments like yours?
    Your are displaying 'Admin' instead of original blogger account name.
    waiting for your reply

  11. says:

    Thanks for the post and the HTML code.

  12. says:

    gracias

  13. says:

    bad timing... this is the good info that im looking before but i dont need it now since im using intense dabate this time :(

  14. says:

    Thank you, this helped me!
    Great articles here...

  15. says:

    thanx

  16. says:

    That's So interesting article, keep it up.

  17. says:

    great..Thanks

  18. says:

    Thank you

  19. says:

    thank´s, that's very cool

  20. says:

    very easy steps of adding those codes...it works

  21. says:

    That's a nice tip, but creates an error with the banner slider of my blog. :(

  22. says:

    Greaet Post, Thank you for sharing

  23. says:

    Thanks xD

  24. says:

    Great article

  25. says:

    thanks! this is useful. I've changed the avatar of my comment form.

  26. says:

    Thank you, the tutorial is really easy and works perfectly :)

    Spark&Bark

    xx

  27. says:

    HI, i discovered your blog, very good, BTW, and tried this tuts, but i can't seem to get it work. I pasted the code, and replaced the 2 URL's, twice..and with your own avatar's here, but it just wont work . can you take a pic? http://oeirascomhistoria.blogspot.pt/

    thx for your time

    cheers
    Acordeiro

  28. says:

    nice one. . thanx

  29. says:

    Worked like a charm! Thanks, man!

  30. says:

    How to delete of Avatar image, because some ppl upload nude image as avatar, i want to delete them

  31. says:

    I'm having the same problem. Copy/Pasted your links and URL's and isn't working. Hmmm, wondering if it only applies to future comments rather than previous?

    Great tutorials BTW - finding your site VERY helpful.

  32. says:

    It worked....Thanks a lot.....I was searching for it for a few hours, and this site resolved it instantly......

  33. says:

    You're welcome, TechStake. Thanks for visiting :)

  34. says:

    Sorry, I forgot to mention that this works only for threaded comments (with reply button) ! But you can still change the anonymous avatar on single level commenting -> please try to apply the trick from here.

  35. says:

    Glad it worked for you :) Thanks for stopping by.

  36. says:

    Thank you, Admin . It's working :D

  37. says:

    I like it! Thank you :D I will try this on my blog.

  38. says:

    Thanks, I didn't know you could do this, is it possible to change the favicon size?

  39. says:

    Thanks , very detail ^^
    i'm trying to change somthing in my blog >.<
    So hard

  40. says:

    thanks

  41. says:

    :)

  42. says:

    this is great!
    do you know how change openID icon?

  43. says:

    not working for me =/

  44. says:

    wow still working for me, thanks admin :)

  45. says:

    Thanks you very much, i've done

  46. says:

    Customizing will always be easy with jquery and javascript. Even adding more functionality to blogger template has become more challenging like adding shopping cart features etc. Your codes are very helpful and the main thing it works...

  47. says:

    thank you!

    www.pisoandbeyond.com

  48. says:

    Thank you! It's done and works

  49. says:

    GREAT! THANKS!

  50. says:

    Awesome tut

  51. says:

    Hey, like it! Thank you . I will try this on my blog.