2014/09/20

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.

Brak komentarzy :

Prześlij komentarz

Komentarze zawierające SPAM zostaną usunięte.

Szablon stworzony z przez Blokotka. Wszelkie prawa zastrzeżone.