Ekim 07, 2013

Blogger Popüler Yayınlar Widgetini Özelleştirmek

Blogger Popüler Yayınlar Widgetini Özelleştirmek

Popüler konularınızı ziyaretçilerinizin dikkatini çekmek için daha belirgin bir hale getirebilirsiniz.
CSS kodları ile Popüper Yayınlar Widgetini değiştirebilirsiniz. Birçok blog yazarının kullandığını gördüğüm popüler yayınları widgetini artık değiştirmenin vakti gelmişti diye düşünüyorum. Bu konuya benzer iki paylaşımda bulunmuştum birisi; Popüler Yayınlara Hareketli Zoom Efekti Vermek diğeri ise ; Popüler Yayınları Renklendirmek eğer ziyaret etmediyseniz bir göz atabilirsiniz.

Eğer blogunuzda "Popüer Yayınlar" widget yok ise;

Blogger > Yerşelim > Gadget Ekle > Popüler Yayınlar Widgetini seçin


Yukarıda bulunan

  • En çok görüntülenen 3 seçenekten istediğiniz birini tercih edebilirsiniz. 
  • Göster kısmında kaç tane popüler yayının gösterilmesini istediğiniz sayıyı seçmelisiniz 1'den 10'a kadar tercih mevcut. İdeal olanı 5tir. Böylece blogunuzda ilk girişlerde bir "geç görüntülenme" olayı meydana gelmemiş olur. 

Widgeti ekledikten sonra CSS kodları ile özelleştirelim

Blogger Kumanda Paneli > Şablon > CTRL + F yardımı ile ]]></b:skin> kodunu bulun. Hemen üzerine gelecek şekilde aşağıdaki kodu ekleyin.

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url(http://4.bp.blogspot.com/-oOVUW06ghgo/UHwuqL9TltI/AAAAAAAAGKU/Nj4DQnvft8k/s1600/1.gif)  no-repeat scroll 5px 10px;
  list-style-type: none;
  margin:0 0 5px 0px;
  padding:5px 5px 5px 20px !important;
  border: 1px solid #ddd;
  border-radius:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
}
.popular-posts ul
  li:hover {
  border:1px solid #6BB5FF;
}
.popular-posts ul
  li a:hover {
  text-decoration:none;
}
.popular-posts .item-thumbnail img {
  webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

Kodu ekledikten sonra ŞABLONU kaydedip çıkın. Herhangi bir sorun olursa yorum kısmından iletebilirsiniz.

Bu arada neredeyse 1 hafta olacak bir şeyler paylaşmayalı. Özlemişim yahu... :) Herkese kolay gelsin, iyi çalışmalar...

2 yorum :

ben de resimler görünmedi kardeş??

@Editör, Resimlerin görünmesi için blogunuzda resimli benzer yazılar eklentisi olması lazım.

Yorum Gönder



Bloglama Zamanı'nda yayınlanacak yeni yazılar e-mail adresinize gelsin.


Google Arkadaşım Ol
Bloglama Zamanı
Bloglama Zamanı

Google+ paylaşımlarımı takip etmek için çevrelerinize ekleyin.