Saturday, March 7, 2015

Most Commented Widget For Blogger


This new widget will help you to show most commented posts to your visitors. This widget will show headline Most Discussed which you may change.

Add This Widget In Blogger-

  • Go to Blogger Dashboard
  • Go To Layout And Then Click Add A Gadget
  • Choose HTML/JAVASCRIPT
  • Paste The Following Code-
  
<style>
/* ######### Most Commented Widget by ngtechzone ##########*/ 
.commentbubble { 
background: #292D30; 
width: 49px; 
float: left; 
margin: 2px 20px 35px 0px; 
font-weight: bold; 
font-size: 1.3em; 
text-align: right; 
font-family: georgia,Helvetica; 
padding: 0px 0px 5px 0px; 
text-align: right; 
color: #FFF; 
text-shadow: 4px 1px #202022; 
position: relative; 
top: 5px; 


.commentbubble: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: 34px; 
right: 6px; 
}
</style>

<script type="text/javascript"> 
function getYpipePP(feed) { 
document.write('<ul style="list-style:none; ">'); 
var i; 
for (i = 0; i < feed.count ; i++) 

var href = "'" + feed.value.items[i].link + "'"; 
var pTitle = feed.value.items[i].title; 
var pComment = + feed.value.items[i].commentcount; 
var pList = '<li style="clear:both; padding:10px 0px 30px 0px!important; border-bottom: 1px dashed #dedede; line-height:2em; "> <div class="commentbubble">
' +pComment +  "&#160;&#160;</div>
" +  "<a href="+ href + '" target="_blank">' + pTitle ; 
document.write(pList); 
//to remove comment count delete this line 
document.write('</a></li>
'); 

document.write('</ul>
'); 

</script> 
<script src="http://pipes.yahoo.com/pipes/pipe.run? 
 YourBlogUrl=http://www.ngtechzone.blogspot.com 
&amp;ShowHowMany=6 
&amp;_id=390e906036f48772b2ed4b5d837af4cd 
&amp;_callback=getYpipePP 
&amp;_render=json" type="text/javascript"></script>




Make These Changes-
Replace with your Blog URL http://www.ngtechzone.blogspot.com
Replace this 6 with how many post titles you wish to display in the list.
To change the background color of the comment bubbles, Simply replace the yellow highlighted hexadecimal color codes ( #292D30 ) with your custom color. To change the Text color of the Comment count Replace #FFF. Replace #dedede if you wish to change the border color that appears below each post title. If you don't want to show a border below each list item then simply delete this line: border-bottom: 1px dashed #dedede;
Finally Enjoy This Widget :-)

No comments:

Post a Comment

PLEASE NOTE:
We have Zero Tolerance to Spam. Spammy Comments and Comments with Links will be deleted immediately upon our review.
For More Rules Read Our Comment Policy