Blogger comments are to much important for discussion or leaving views on any blog post. Mostly we always check the comments before start reading any topic to see the public response. So here i am going to introduce recent comment widget in which top most recent comment on you blog will displays. The best part about this widget is it includes Avatar in round shape image for every comment. This widget works
automatically update to your latest comment. So if you want to see a demo the see at the bottom of our blog in footer section. If you like this and want to add this gadget on your blog then follow below steps

Steps To Add Recent Comment Widget


  • Go To Blogger Dashboard >> Then Layout
  • Then click on Add Gadget Button
  • Now Click on HTML/JavaScript
  • Then paste below code in gadget box

 <style type="text/css">

    ul.ST_recent_comments{list-style:none;margin:0;padding:0;}
    .ST_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;}
    .ST_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;}
    .ST_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .ST_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     = 40,
    roundAvatar    = true,
    characters     = 40,
    showMorelink    = false,
    moreLinktext    = "More »",
    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",
    hideCredits    = true;
//]]>
</script>
<script type="text/javascript" src=" https://googledrive.com/host/0B_1mqJd2tC8qdDdPb25PXzNiSUk"></script>
<script type="text/javascript" src="http://safe-tricks-demo.blogspot.in//feeds/comments/default?alt=json&callback=ST_recent_comments&max-results=5"></script>

  
  • After pasting above code click on the save button
  • Now refresh your Homepage and see widget and you have done.

Post a Comment

Previous Post Next Post