Subscribe Here RSS or Email

10/22/08

I can see you! Faces of your Commenter's can now be seen

11 comments Buzz Here

Okay, just ignore my Title i am not really great of making a capturing title but just in case you read this post because of the title then i can say that i got lucky haha...

With my previous post i showed you how to customize your comment system and who say's that it's only wordpress can have fancy comment system? With the help of some very talented programmers, bloggers and hackers(Not the bad hackers i am talking here but those who play with codes and hacks) all of this makes possible. Now you can see your commenters avatar, how? i will explain them shortly.

I got a comment from Gem say's
"I was also trying to see whether it is possible to use profiles instead of MyBloglog hack. As you see, those who left comments above do not have their own MyBloglog accounts.

I guess no one figured that out. I've been using Google for that hack, by the way."
Answer to that is it is possible and already been used by few bloggers. Scripted by Singpolyma based by the work of Johan Sundstrom Updated by PurpleMoggy Updated and Promoted by http://www.bloganol.com i don't have any contribution but to spread it :)

Here's how to do it:
Go to your Dashboard - Layout - Edit HTML (Important! Save your template)
Hit Ctrl+F type </head>
Above that code place this Script


<script src='http://bloganolutilities.googlepages.com/blogger_comment_photos.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
addLoadEvent(function(){showCommentPhotos('commentphoto','comment-author', 1);});
//]]>
</script>



... Then Save.

Next is to tick the Expand Widget Template and look for this code Ctrl+F type dl id='comments-block

Here's what it all look like...

<dl id="comments-block">
<b:loop values="data:post.comments" var="comment">
<dt class="comment-author" id=""comment-" + data:comment.id">
<a name=""comment-" + data:comment.id">
<b:if cond="data:comment.authorUrl">
</b:if></a><a href="data:comment.authorUrl" rel="nofollow"><data:comment.author></data:comment.author></a>
<b:else>
<data:comment.author>
</data:comment.author>
<data:commentpostedbymsg>

</data:commentpostedbymsg></b:else></dt><dd class="comment-body">
<b:if cond="data:comment.isDeleted">
<span class="deleted-comment"><data:comment.body></data:comment.body></span>
<b:else>
<p><data:comment.body></data:comment.body></p>
</b:else>

</b:if></dd><dd class="comment-footer">
<span class="comment-timestamp">
<a href="http://www.blogger.com/%22#comment-%22%20+%20data:comment.id" title="comment permalink">
<data:comment.timestamp>
</data:comment.timestamp></a>
<b:include data="comment" name="commentDeleteIcon">
</b:include></span>
</dd>
</b:loop>
</dl>


Select the whole block of code and then replace them with this code below:

<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/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<div class='commentphoto' style='float:left;margin:5px;'/>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<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>
<div style='clear:both;'/>
</b:loop>
</dl>


Then Preview -- If no red marks shows you have no problem then save. Check your comments and now shows the profile images of your commenters.

Credit


Credit have already placed above as part of my post. Post Source: Bloganol.com

Related Posts by Categories



11 comments:

twinks said... at 23/10/08 04:54

Yeey! finally I can see my commenters! hehehe.. thank you so much for sharing this.. I was looking for a hack like this earlier, couldn't find one. It works in my blog..however, there's a problem, the "highlight author " color in my comment box disappeared. Hope you can help me..
thanks in advance :]

-emirie- said... at 23/10/08 21:05

Thanks for sharing, I just tried it now and did not have any problem. Now I love the new look of my comment section.

pusa said... at 23/10/08 21:48

hmmm i wann a see my face too!!! LOL i'll try to put this in my blog

Bob Caine said... at 24/10/08 01:55

Thanks for the post, I can't wait to trying out. It will be great to see my commentors.

Raquel said... at 24/10/08 12:51

Hi, your post is very interesting. I was using this feature about a year ago but I have noticed, my page is slow. Singpolima's script is worst, I still see page error in IE browser. But Purple moggy is better than him. Anyway, I would like to share this test blog, I am using purplemoggy's script. link

Iris said... at 24/10/08 14:30

Thank you Raquel for the info.

What Purple Moggy have done is added some part for limiting the images which i believe already part of the javascript above. But to those who wants to see more about this hack please read purple moggy post aswell...Comment Author Photo's

Raquel said... at 24/10/08 22:47

Hi Irish, thank you for the reply. Yeah-yeah, this is where I got the hack.

It is really nice of you for sharing your knowledge to everyone. If they know how to work with blogger, they will love it.

NathanKP said... at 29/10/08 08:29

This sounds neat, but I've been using a Sezwho plugin so I think that to avatar services would conflict.

NathanKP - Inkweaver Review

•▬●๋•p.k.áŕừń●๋•▬• said... at 21/3/09 05:08

sorry unfortunatly this is not worked for me ...

www.hacking2all.blogspot.com

Post a Comment

I really love to read your thoughts, Reminder though that I Moderate my blog, If your intention is only to spam think twice.

For those that will comment because you want to share your thoughts i really appreciate your time. "Dofollow" Rules.

 

  © Blogger template 'tbn' by thebuzznutter 2008

Bring me to TOP