Show Commentators Profile Pic In Blogger

Using this simple and easy hack,you can enable your blogger template to display the picture of who is commenting under your post.This is a cool tweak and many bloggers will be wanting to use it.So here are the simple steps:

1.Login to your Blogger Dashboard--->Layout--->Edit HTML and click on Expand Widget Templates.

2.Now search for </head> code in your template and the paste the following code just before </head>

<script src=’‘http://www.thetricks.net/blogger/blogger_comment_photos.js“ type=’text/javascript’/>

<script type=’text/javascript’>

//<![CDATA[

addLoadEvent(function(){showCommentPhotos('commentphoto','comment-author', 1);});

//]]>

</script>

3.Now find below code in your template:

<dl id=’comments-block’>

<b:loop values=’data:post.comments’ var=’comment’>

<dt class=’comment-author’ expr:id=’”comment-” + data:comment.id’>

<a expr:name=’”comment-” + data:comment.id’/>

<b:if cond=’data:comment.authorUrl’>

<a expr:href=’data:comment.authorUrl’ rel=’nofollow’><data:comment.author/></a>

<b:else/>

Add <div class=’commentphoto’ style=’float:left;’/> just after <dt class=’comment-author’ expr:id=’”comment-” + data:comment.id’>
You can also change the float from left to right according to your choice.

4.Now find the code given below:

<dd class=’comment-footer’>

<span class=’comment-timestamp’>

<a expr:href=’”#comment-” + data:comment.id’ title=’comment permalink’>

<data:comment.timestamp/>

</a>

<b:include data=’comment’ name=’commentDeleteIcon’/>

</span>

</dd>

</b:loop>

</dl>

Add <div style=’clear:both;’/> just after the code given in red,i.e., </dd>

Now click save template and you are done.

Spl. Thanx to TheTricks.net