How To Enable Avatars in Blogger Comments

Posted by Lasantha Bandara on December 5th, 2009 File Under : change template, comments, image2 Comments

If you use this hack,you can show Show Blogger Profile Images In Comments As Avatars.For your safety,first backup your blogger template.To Enable avatars in blogger/blogspot comments follow the steps below.If first method doesn't work for you,then follow the second method.

comment avatars in blogger

Method 1

1.Login to your blogger dashboard--> Settings- -> Comments.

2.Enable Show profile images on comments.

Enable Avatars in Blogger Comments

3.Now Click on "Save Settings" and you are done.

Method 2

1.Login to your blogger dashboard--> Settings- -> Comments.

2.Enable Show profile images on comments.

Enable Avatars in Blogger Comments

3.Now Click on "Save Settings".

4.Go to Layout- -> Edit HTML.

5.Click on "Expand Widget Templates".

Expand Widget Templates

6.Now search below code in your template.

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

NOTE: If you can find above code no problem.But if you can't find it then search:

<dl id='comments-block'>

or

<div id='comments-block'>

in your template.

Now Replace it with:

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

7.Now find below code:

<a expr:name='data:comment.anchorName'/>

Note:You can see above code one or more time.

8.Now Replace every above code (<a expr:name='data:comment.anchorName'/>) with below code:

<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<div expr:class='data:comment.avatarContainerClass'>
<data:comment.authorAvatarImage/>
</div>
</b:if>

9.Now find ]]></b:skin> tag in your template.

10.Copy below code and paste it just before ]]></b:skin> tag.

/* Avatar */
.avatar-image-container img {
background:url(http://4.bp.blogspot.com/_4HKUHirY_2U/SxnvaGA8qdI/AAAAAAAAAc0/0b9ZY2P2P0A/comment+avatar.png);
width:35px;
height:35px;
}

11.Save your template and you are done.

File Under : change template, comments, image

2 Responses to “How To Enable Avatars in Blogger Comments”

  1. Chio says:

    Hey,

    Thanks for this. I have now successfully enabled avatars on my blog.

    Keep up with the good stuff 😉

  2. Jason Andrews says:

    Wow thax this work great.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.