CUSTOMIZE RECENT COMMENTS WIDGET WITH AVATAR

CUSTOMIZE RECENT COMMENTS WIDGET WITH AVATAR – How to make recent comments with avatar for your blogger and blogspot ? OK now, I will share to you how to make it. An also it has been added with a cool rounded avatar and comment excerpts.
Recent comments is a important widget to find anyone who commented on our blog quickly. So with this widget we can find out and respond it quickly. Then how do I make it? I’ve got this tutorial from Way2Blogging

recent comments widget with avatar
recent comments widget with avatar

HOW TO MAKE RECENT COMMENTS WIDGET WITH THUMBNAIL
1. Open your blogger Dashboard > Layout > Add a Gadget > HTML/Javascript
2. Copy code below and paste it to HTML/Javascript widget

<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li .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;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 32,
roundAvatar = true,
characters = 40,
showMorelink = false,
moreLinktext = "More »",
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js"></script>
<script type="text/javascript" src="http://your_url.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

3. Then klick save,You can change the number of comments, the size of avatar, and the excerpt by replacing some of the code above.

recent comments with avatar

Thank’s for reading CUSTOMIZE RECENT COMMENTS WIDGET WITH AVATAR , I hope you understand with my explanation. Please read  CARA MEMBUAT RECENT COMMENT WITH AVATAR for indonesian language.

Leave a Reply

Your email address will not be published. Required fields are marked *

No Live Link Please! and Leave a Relevant Comment