Bugün sizler için hazırladığım blogger en çok yorumlanan yazılar eklentisini paylaşacağım. Öncelikle eklentiyi hazırlamamda yardımcı olan Yahoo pipe sistemine teşekkür ediyorum. Eklenti hakkında kısaca bilgi vermek gerekirse; ziyaretçilerinizin en çok yorum yaptığı konuları, yanındaki sayaçla birlikte blogger'ın popüler yayınlar eklentisi gibi gösterir. Sizlerle iki stil paylaştım. Rengarenk resimli ve sade beyaz resimsiz stil olmak üzere. İsteğinize göre kaç blog yazınız görünsün veya rengini, boyutlarını vs. ayarlayarak sidebar'ınızda kullanabilirsiniz. Umarım beğenirsiniz.
Blogger'a ekleme
En çok yorum alan yazılar eklentisi 1. Stil
<!--En çok yorum alan yazılar eklentisi by MeftunMede.blogspot.com-->
<style>
.yorum-sayaci {
background:none repeat scroll 0 0 #fff;
color:#000;
font-family:arial,Helvetica,sans-serif;
font-size:14px;
float:right;
padding:5px;
margin:2px 3px;
}
.encok-yorumlananlar ul {
font-family:arial,Helvetica,sans-serif;
padding:0!important;
margin: 12px 0px;
}
.encok-yorumlananlar ul li {
list-style-type:none;
color:#555;
margin-top:-10px;
padding:6px 0px 2px 4px;
}
.encok-yorumlananlar ul li a {
color:#000;
font-weight:700;
text-decoration:none;
font-size:12px;
margin-top: 0px;
}
.encok-yorumlananlar ul li p {
color:#444;
font-weight:400;
text-decoration:none;
font-size:11px;
padding: 0px;
margin: 0px;
}
.encok-yorumlananlar ul li img {
float:left;
width:60px;
height:60px;
margin:0 5px 0 0;
}
.encok-yorumlananlar:nth-child(1n+0) {
background:none repeat scroll 0 0 #F49A9A;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(2n+0) {
background:none repeat scroll 0 0 #FCD092;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(3n+0) {
background:none repeat scroll 0 0 #ee6107;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(4n+0) {
background:none repeat scroll 0 0 #B1DAEF;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(5n+0) {
background:none repeat scroll 0 0 #ff0;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(6n+0) {
background:none repeat scroll 0 0 #c7e93d;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(7n+0) {
background:none repeat scroll 0 0 #f8e000;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(8n+0) {
background:none repeat scroll 0 0 #fcad37;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(9n+0) {
background:none repeat scroll 0 0 #ee377a;
width:100%;
height:72px;
}
.encok-yorumlananlar:nth-child(10n+0) {
background:none repeat scroll 0 0 #5ebded;
width:100%;
height:72px;
}
</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+" alt='" + feed.value.items[i].title + "'/>";
var postDescription = feed.value.items[i].postdescription;
var postComments = feed.value.items[i].commentcount;
var postList = '<div class="encok-yorumlananlar"><ul><li><div class="yorum-sayaci">' + 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?
BlogAdresiniz=http://meftunmede.blogspot.com
&YaziSayisi=5
&_id=646ff03c0c31474866da421f8a061632
&_callback=mostcommented
&_render=json"
type="text/javascript"></script><span style="float:right;"><a style="font-size:11px;color:#FFF !important;" href="http://meftunmede.blogspot.com">Created by Meftun MEDE</a>
</span>
<!--En çok yorum alan yazılar eklentisi by MeftunMede.blogspot.com-->
En çok yorum alan yazılar eklentisi 2. Stil
<!--En çok yorum alan yazılar eklentisi by MeftunMede.blogspot.com-->
<style>
.yorum-sayaci {
background:none repeat scroll 0 0 #292D30;
width:30px;
float:left;
font-weight:700;
font-size:17px;
font-family:arial,Helvetica,sans-serif;
text-align:right;
color:#FFF;
text-shadow:4px 1px #202022;
position:relative;
top:5px;
margin:0 5px 5px;
padding:8px 7px 8px 0;
}
.yorum-sayaci:after {
content:" ";
position:absolute;
width:0;
height:0;
top:35px;
right:6px;
border-color:#292D30 #292D30 transparent transparent;
border-style:solid;
border-width:5px 8px;
}
.encok-yorumlananlar ul {
font-family:arial,Helvetica,sans-serif;
margin:4px 0;
padding:0!important;
}
.encok-yorumlananlar ul li {
list-style-type:none;
color:#555;
border-bottom:1px dashed #dedede;
line-height:20px;
margin:0;
padding:5px 0;
}
.encok-yorumlananlar ul li a {
color:#000;
font-weight:700;
text-decoration:none;
font-size:12px;
margin-top:0;
}
.encok-yorumlananlar ul li p {
color:#444;
font-weight:400;
text-decoration:none;
font-size:11px;
margin: 0px 0px 0px 48px;
padding:0;
}
.encok-yorumlananlar:nth-child(n) {
background:none repeat scroll 0 0 #FFF;
width:100%;
height:auto;
}
</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 postDescription = feed.value.items[i].postdescription;
var postComments = feed.value.items[i].commentcount;
var postList = '<div class="encok-yorumlananlar"><ul><li><div class="yorum-sayaci">' + postComments + "</div>" + "<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?
BlogAdresiniz=http://meftunmede.blogspot.com
&YaziSayisi=5
&_id=646ff03c0c31474866da421f8a061632
&_callback=mostcommented
&_render=json"
type="text/javascript"></script><span style="float:right;"><a style="font-size:11px;color:#FFF !important;" href="http://meftunmede.blogspot.com">Created by Meftun MEDE</a>
</span>
<!--En çok yorum alan yazılar eklentisi by MeftunMede.blogspot.com-->
Özelleştirme
■ Kodlar içinde mavi renkle işaretlediğim yerlerde arkaplan renklerini değiştirebilirsiniz.■ Kırmızıyla işaretlediğim yerlerde;
BlogAdresiniz= Blog adresinizi yazın.
YaziSayisi=5 ; Kaç blog yazınız görünsün, çoğaltabilir veya azaltabilirsiniz.
postDescription,10 ; Eklentideki konu açıklamasının karakter sayısal değerini azaltabilir yada çoğaltabilirsiniz.
■ Son olarak eklenti yorumların sayısını belirtiyor. Eğer "15" yazması yerine "15 yorum" yazmasını isterseniz; aşağıda gösterdiğim değişikliği yapabilrsiniz.
<div class="yorum-sayaci">' + postComments + "</div>"
<div class="yorum-sayaci">' + postComments + " Yorum" + "</div>"
Bu kadar. Kodu denemek için Online html editor'ü kullanabilirsiniz.
Herkeze kolay gelsin. Yapamadığınız bir şey olursa "YORUM" kısmında belirtebilirsiniz. iyi bloglamalar...
Hiç yorum yok:
Yorum Gönder