Recent Comments Widget v3 for Blogger

Posted On // 26 comments
Recent Comments Widget v3 for Blogger
Hello folks, I am back with yet another remake of a widget and this time its the Popular Posts widget originally coded by Danish Harish and later edited by many fellow bloggers. Just like them I have too made a minute change in the widget and added hover animation in it.

The live demo of this widget can be seen by clicking the below button.

Live Demo


Once you have seen the demo, to add this widget in your blogger blog follow the instructions given below.

Adding the Widget


To add this widget in your blog firstly go to Blog Title → Layout → Add Widget → HTML/JavaScript. Add the below given code.

<style type="text/css" scoped>
ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;}
.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}
.allbloggertricks_recent li:hover{border:1px solid #ddd;
-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }
.allbloggertricks_recent a {text-decoration:none;}
.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px
#ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;width:35px;height:35px}
.allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;}

</style>
<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 35,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
 maxfeeds=50,
 adminBlog='Your Name';
//]]>
</script>
<script type="text/javascript" src="http://files.allbloggertricks.com/Scripts/abt-recent-commentsv3.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=allbloggertricks_recent&amp;&amp;max-results=50">
</script>

Add the above code and follow the below instructions.

Setting up the Widget


After adding the code check the configuration of the widget.

numComments - Shows the maximum number of comments to show in the widget.
showAvatar - Change to false if you want to hide avatar in the widgets.
avatarSize - The size of the avatars in the widget measured in pixels.
roundAvatar - Change to false if you do not want the avatar to be round in shape.
characters - No. of characters to show in the comment.
defaultAvatar - The picture to be used when a comment has no avatar.
adminBlog - Replace Your Name with the admin's name so his comments can be hidden.

After making all the changes save the template. You are done now. Now you and your visitors can see this awesome recent comments widget on your blogger blog.

Lastly here comes the update notes of this widget.

v.1 - 11.01.2012
  • Released
  • Script by Harish Dasari
v.2 - 14.05.2012
  • Script modified by Asep
  • Admin removed Comments
v.3 - 09/15/2013
  • Script modified by Afandi Kusuma
  • Expanded clickable area
  • Fixed HTML5 validation issues by Kang Ismet
  • Added animation on hover by AllBloggerTricks
 More work and the expansion of this widget by fellow bloggers will be encouraged.

26 comments

Gagan Masoun Author
18 October 2013 at 04:43

nice widget brother :)

Reply
21 October 2013 at 05:57

Great recent comment widget. i will definately use it on my blog. keep blogging !

Reply
ImCWIT Author
24 October 2013 at 11:15

Great widget bro.

Reply
Lee Peace Author
25 October 2013 at 01:51

An awesome widget! Thanks!

Reply
26 October 2013 at 09:48

Awesome widget bro :)

Reply
Rahul Jaykar Author
27 October 2013 at 20:51

You are awesome......Best Site For Widget..

Reply
Rezza Author
29 October 2013 at 17:48

Hi there,

This is cool widget. Great jobs buddy! :)

By the way, i have little request here. I really like your leaderboard ads placement inside the post here. I f you don't mind, can you give us a tutorial how to add it just like yours? :)

Best Regards.

Reply
Phan Phi Author
1 November 2013 at 09:48

so nice.Thanks. i do it for my blog : www.expshare.net

Reply
Alief Rezki Author
12 November 2013 at 07:26

Aww , you event know indonesia blogger, Kang ismet

Reply
Nucky.P .N Author
25 November 2013 at 14:55

Thank for share it good and i like

Reply
2 December 2013 at 05:46

http://www.cunconblog.com/2013/12/tien-ich-nhan-xet-moi-cho-blogspot-dep-tuyet.html

thanksssss

Reply
Mayank Uttam Author
7 December 2013 at 22:52

download fileice premium accounts and fileice downloader by completing just one survey guys from here it is really working www.fileicebypass er2014.blogspot.co m

Reply
shanu Author
8 December 2013 at 01:14

nice widget bro

download fileice premium accounts and fileice downloader by completing just one survey guys from here it is really working www.fileicebypasser2014.blogspot.com

Reply
Admin Author
21 December 2013 at 22:39

Going to Add This Widget in my Blog And Also Redirect To Your Website

Reply
1 January 2014 at 05:01

good

Reply
24 May 2014 at 22:53

This is awesome! Keep up posting Tiny Serval

Reply
Sang Prabu Author
26 August 2014 at 03:13

Not work bro -_-

Reply
sistunes Author
31 August 2014 at 02:54

not working bro cause your javascript from dropbox not found that you deleted :(

Reply
Tech Blog Author
7 May 2015 at 20:54

not working :(

Reply
Anonymous Author
18 May 2015 at 08:37

wowwww lovely

Reply
26 November 2015 at 21:02

Great widget, thank you bro :)

Reply
Amit aggarwal Author
2 January 2016 at 05:00

it helps me to add this widgets, your post is awesome
www.whytofail.blogspot.com/

Reply
3 January 2016 at 12:08

Why deleted ? abt-recent-commentsv3.js

Reply
2 February 2016 at 00:26

Fixed !

Reply
Usman Author
9 February 2016 at 22:17

I don't want to use this long script on my website, it would only increase the size and load time. Is there a jQuery for this instead?

Reply
5 August 2016 at 15:45

awsome article.thx

Reply

Post a Comment

Please do not spam here. All comments will be moderated.
Don't You Think this Awesome Post should be shared ??
| Recent Comments Widget v3 for Blogger |