Beauty

Najczęściej komentowane posty - kolorowy widżet dla Bloggera


Przedstawiamy kolorowy widżet, który wyświetla tytuły najczęściej komentowanych postów na Twoim blogu. Teraz każdy użytkownik Bloggera, może mieć taki u siebie!
Umieszczanie widżetu na Bloggerze

W menu Układ => Dodaj gadżet HTML/Javascript z poniższym kodem:
<style>
.comment-count {
    padding: 3px 10px;
    background: #fff;
    color: #000;
    font-size: 10px;
    float: right;
}

.most-commented ul {
    padding: 0px !important;
    font-family: Century Gothic, sans-serif;
}

.most-commented ul li {
    list-style-type: none;
    padding: 10px;
    color: #555;
    margin-top: -10px;
}

.most-commented ul li a {
    color: #444;
    font-weight: bold;
    text-decoration: none;
    font-size: 11px;
}

.most-commented ul li img {
    float: left;
    margin: 0px 5px 0px 0px;
    width: 60px;
    height: 60px;
}

.most-commented:nth-child(3n+0) {
    background: #ee377a ;
    width: 100%;
}

.most-commented:nth-child(4n+0) {
    background: #fcad37;
    width: 95%;
}

.most-commented:nth-child(5n+0) {
    background: #f8e000;
    width: 90%;
}

.most-commented:nth-child(6n+0) {
    background: #c7e93d;
    width: 85%;
}

.most-commented:nth-child(7n+0) {
    background: #5ebded;
    width: 80%;
}
</style>
<script type="text/javascript">
function stripTags(s,n) {
    return s.replace(/<.*?>/ig,"").split(/\s+/).slice(0,n-1).join(" ")
}
function mostcommented(feed) {
    var i;
    for (i = 0; i < feed.count ; i++) {
var postURL = "'" + feed.value.items[i].link + "'";
var postTitle = feed.value.items[i].title;
var postthumbnail = "<img src="+feed.value.items[i].postthumbnail+" />";
var postDescription = feed.value.items[i].postdescription;
var postComments = feed.value.items[i].commentcount;
var postList = '<div class="most-commented"><ul><li><div class="comment-count">' + postComments + "</div>" + postthumbnail + "<a href="+ postURL + '">' + postTitle + "</a>"  + '<p>' +stripTags(postDescription,10)+'...</p>' + '</li></ul></div>';
 document.write(postList);
     }
 }
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
AddUrlHere=http://blokotek.pl
&NumberofPosts=5
&_id=2cb5eb603ed55a6264ee1484e5fdd45c
&_callback=mostcommented
&_render=json"
type="text/javascript"></script><span style="font-size: 80%; float:left;"><a href='http://blokotek.pl/'>Blokotek</a></span>

Link zaznaczony na pomarańczowo zamień na adres własnego bloga na Bloggerze.
Na koniec zapisz.

Instagram