Method 1
1.Login to your blogger dashboard--> Settings- -> Comments.
2.Enable Show profile images on 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.
3.Now Click on "Save Settings".
4.Go to Layout- -> Edit HTML.
5.Click on "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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE6W5srgk6ltdaBzfN9bw9LYEI-JXr2SHxfrl9RbfEBcU-Kv8-Ycii78BHxmMteJNqPTLh4-08rO2PvpvHCrB5o8pkA1ehFU2z0cbeK9k6Lrf50G3paHvqZtxPflIw1njrmgcL8V_a0MDo/+avatar.png);
width:35px;
height:35px;
}
11.Save your template and you are done.
Post a Comment