Most Discussed Widget with Comment Counter for Blogger

most commented widget

Generally a blogger wants to get more page view by all means. For this reason there are zillions of widget is creating by blog developer day by day. We have got many popular widget which can increase our page view. So I have created a widget which is known as Most discussed widget with comment counter. This widget will work like Popular Posts widget but in differently way. Because Most Discussed widget will display the post which has got more comments. And it will priority based display most commented widget in hierarchy. Actually the base coding was created by BloggerSentral.com and I have integrated and modified Popular Most Commented widget code. This widget code has created by using Yahoo Pipes. So most credit goes to BloggerSentral.com. But I have made this attractive which can easily attract visitors to click on it. This is the best widget to show off which posts got attention of visitors and talking about it. I hope you will like this widget.

blogger widget

Step 1 Log in to your Blogger account and Go to your Blogger Dashboard

Step 2 Go to your Layout tab.

Step 3 Click on "Add a Gadget" then select "HTML/JavaScript" Widget.

Step 4 Now Copy the below code and Paste it in "HTML/JavaScript" Gadget.

 <style>
.BloggerSpiceDW {
background: #292D30;
width: 49px;
float: left;
margin: 2px 20px 15px 0px;
padding: 0px 0px 5px 0px;
font-weight: bold;
font-size: 1.4em;
text-align: right;
font-family: georgia, Helvetica;
color: #FFF;
text-shadow: 4px 1px #202022;
position: relative;
top: 5px;
border-right: 1px solid #F3F3F3;
}
.BloggerSpiceDW:after {
content: ' ';
position: absolute;
width: 0;
height: 0;
right: 0px;
top: 100%;
border-width: 5px 8px;
border-style: solid;
border-color: #292D30 #292D30 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
top: 28px;
right: 6px;
}
#BloggerSpice li:hover {
border-bottom: 1px dashed #696969!important;
}
#BloggerSpice a {
text-decoration: none;
color: #5A5F63;
}
#BloggerSpice a:hover {
color: #2B3033;
}                                                                                                                             /* Widget By http://www.bloggerspice.com */
</style>
 <div class="widget HTML" id="BloggerSpice">
<script type="text/javascript">
var _0xba63=["<ul style=\"list-style:none; \">", "write", "count", "\'", "link", "items", "value", "title", "commentcount", "<li style=\"clear:both; padding:10px 0px!important; border-bottom: 1px dashed rgb(222, 222, 222); line-height:2em; \"> <div class=\"BloggerSpiceDW\">", "&#160;&#160;</div>", "<a href=", "\" target=\"_blank\">", "</a></li>", "</ul>"];
function getYpipePP(_0x8a60x2) {
    document[_0xba63[1]](_0xba63[0]);
    var _0x8a60x3;
    for (_0x8a60x3 = 0; _0x8a60x3 < _0x8a60x2[_0xba63[2]]; _0x8a60x3++) {
        var _0x8a60x4 = _0xba63[3] + _0x8a60x2[_0xba63[6]][_0xba63[5]][_0x8a60x3][_0xba63[4]] + _0xba63[3];
        var _0x8a60x5 = _0x8a60x2[_0xba63[6]][_0xba63[5]][_0x8a60x3][_0xba63[7]];
        var _0x8a60x6 = +_0x8a60x2[_0xba63[6]][_0xba63[5]][_0x8a60x3][_0xba63[8]];
        var _0x8a60x7 = _0xba63[9] + _0x8a60x6 + _0xba63[10] + _0xba63[11] + _0x8a60x4 + _0xba63[12] + _0x8a60x5;
        document[_0xba63[1]](_0x8a60x7);
        document[_0xba63[1]](_0xba63[13]);
    };
    document[_0xba63[1]](_0xba63[14]);
};
 </script>
  <script src="http://pipes.yahoo.com/pipes/pipe.run?
 YourBlogUrl=http://www.bloggerspice.com &amp;ShowHowMany=7&amp;_id=390e906036f48772b2ed4b5d837af4cd&amp;_callback=getYpipePP&amp;_render=json" type="text/javascript"></script>
</div>


Step 5 Now hit the Save button and check the blog for viewing the widget.

Customization

  • Replace www.bloggerspice.com  with your blog address.
  • Change ShowHowMany=7digit to display number of Most Discussed Posts.


EmoticonEmoticon