Implementation of Comment Avatars
1.First of all Go to Blogger > Settings >Comments and enable “Show profile images on comment”2.Now if you have a normal un customized template you will see the avatars on the comments on your blog.
3.If you have a customized template you will have to add some codes and play around with your template.For that first go to Blogger Layout >Edit HTML and backup your template.
4.Expand the widget templates and check if you can find this line there
If you couldn’t find this,then do the following steps.
a)Find
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
and replace each of it with
If you are using the author comment highlighting trick and if doesn’t work out with that trick,then leave a comment and i will try to help you out..
Further Styling.
If you want to add a default avatar for the ones with no profile pics,then place the CSS code just aboveCSS Code
.avatar-image-container {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_64508tF6ruW6kCor946aGsZd5-ElQzcU09mxcviJPMEh1WSbgN3UVEenjFOyBaqFWou577OixMqhhHo_ZOlIPJJ4oT8-39wQfns_Vcv_YrTKzeHFL6nBxIWa-UGCaKzZVCRNSrMWIg/s400/default.gif); width:35px;height:35px; }
.avatar-image-container img { border:none;} You can customize the CSS according to what you need.
If you need bigger avatars instead of smaller ones,then use the following CSS instead of the one above.
.avatar-image-container{width:50px;height:50px;margin-top:-5px;}
.avatar-image-container img {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaS49JTfUrbv_pKMME5_Aoh5M2HV_8VlzA7P2Hn8yATKL4bNrIl9bOfF_pD-NJf00a8iZDvp4XGebo-2bUsY53Na-xWowiL7ehZFoyO04hMKUWZcGg-9ZSo-wuuiAtQ9CBk4-wCJcKQ58/s400/grav.png);width:50px;height:50px;} This will give you a bigger avatar and also a default gravatar image but it has a little drawback.It will also resize the small blogger favicons to a big size.(blooger favicon is displayed when a blogger user doesn’t have a profile avatar.Similarly OpenId also has a similar small icon.. ).
BTW to set you avatar pic you can use two methods.You can choose the edit profile link on your blogger profile and upload an image there,The second method is to enter a blogger comment somewhere in any blogger comment form and then click the Preview button instead of the Post Comment button.Now you will see an option to upload your avatar.
In case anything bad happens restore the template backup.. and comment here..:)
