Blogger Popüler Yayınlar Eklentisi Renkli Versiyon

Popüler-yayınlar-renklendirme-kodu
Popüler Yazılar Eklentisi
Blogger altyapısı için popüler yayınlar eklentisini renklendirme kodu nasıl eklenir?
  Blogger için daha kullanışlı ve şık popüler yazılar eklentisini paylaşmak istiyorum. Daha önce farklı versiyonlarının nasıl yapılacağını diğer yazılarımda göstermiştim. Hem seçenekleri artırmak hem de blog sayfamıza yeni hava katmak için beğendiğim ve kusursuz çalışan kodları vermeye devam ediyorum. Blog sayfanızda popüler yazılar eklentisini kullanmıyorsanız hemen kullanmanızı tavsiye ederim. Seo için gerekli ve sitede geçirilen süre için olumlu faydası var. Ayrıca ana sayfanızda görünmeyen ama önem verdiğiniz diğer yazılarınızda listelenmiş olur ve belki de yorum alır. Bu kısa tavsiyemden sonra kodu nereye ekleyeceğinizi ve nasıl görüneceğini göstermek istiyorum. Öncelikle "Gadget Ekle" bölümünden hazır popüler yayınlar eklentisini kurun. Daha sonra görüntüyü istediğimiz gibi yapabilmek için aşağıdaki kodu ]]></b:skin> kodundan önce yapıştırın ve temanızı kaydedin.

/*Renkli Populer Yayınlar Eklentisi Baslangıcı https://dogushakanyilmaz.blogspot.com*/#PopularPosts1 ul li a:hover{color:#fff;text-decoration:none}#PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 11px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;}#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:30px;background:transparent;padding:0;width:51px;height:51px}#PopularPosts1 ul li:first-child:after,#PopularPosts1 ul li:first-child + li:after,#PopularPosts1 ul li:first-child + li + li:after,#PopularPosts1 ul li:first-child + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after,#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"}#PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"}#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"}#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:89%}#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"}#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:89%}#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"}#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:89%}#PopularPosts1 ul li:first-child + li + li:after{content:"3"}#PopularPosts1 ul li:first-child + li{background:#ff764c; width:89%}#PopularPosts1 ul li:first-child + li:after{content:"2"}#PopularPosts1 ul li:first-child{background:#ff4c54 ;width:89%}#PopularPosts1 ul li:first-child:after{content:"1"}#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none}#PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}/*Renkli Populer Yayınlar Eklentisi Sonu https://dogushakanyilmaz.blogspot.com*/
  Kendi blog sayfamda kullandığım ve beğendiğim bir eklenti. Daha önce popüler yazılar eklentisini başka bir kod ile değiştirdiyseniz eski kodu kaldırmayı unutmayın. Genellikle popüler yazılar için değişiklik sadece ilgili alana ekleyeceğiniz kod ile oluyor. Basit bir şekilde kurulum yaptıktan sonra kodun üst tarafındaki alanda yazı boyutu, yazı fontu ve yazı rengi gibi ayarları değiştirebilirsiniz.

✔ Bu içeriği beğendiyseniz lütfen paylaşın ⤵

YAZIYI PAYLAŞ

BENZER YAZILAR

SONRAKİ
« Prev Post
ÖNCEKİ
Next Post »

5 yorum

yorum YAZ
5 Eylül 2017 20:09

Emeğinize sağlık. ben mevcut haliyle google eklentilerini kullanıyorum ve şimdilik seviyorum da. :)

Cevap Ver
avatar
5 Eylül 2017 20:45

Aslında mevcut eklentiler yeterli ama temasını farklı kullanmak isteyenler için fikir olabilir. Teşekkürler

Cevap Ver
avatar
6 Eylül 2017 13:11

Yine yararlı bir bilgi öğrenmiş oldum sayenizde.
Teşekkürler

Cevap Ver
avatar
6 Eylül 2017 13:32

Merhaba Hakan Bey,
Blogunuzdaki (Blog istatistikleri) bölümünü bloguma nasıl ekleyebilirim?
Çok yararlı olacak benim için.
Şimdiden teşekkür ederim

Cevap Ver
avatar
6 Eylül 2017 17:42

Teşekkürler yorumunuz için..Aşağıdaki linke tıklayıp yazıyı okumanız yeterli. İşlemi sırasıyla yapınca sorunsuz oluşturabilirsiniz.

https://dogushakanyilmaz.blogspot.com/2017/01/blogger-istatistik-eklentisi.html

Cevap Ver
avatar

YORUM YAPARAK KATKIDA BULUNABİLİRSİNİZ...

1) Yaptığınız yorumun, yazıyla alakalı olmasına özen gösterin.
2) Yazım ve dil bilgisi kurallarına mümkün olduğunca dikkat edin.
3) Kullandığınız üslubun sizi yansıttığını unutmayın.
4) Yorum yaparken link eklemeyin.
5) Yorumunuza ikon eklemek için "Emoticon" butonuna tıklayın.
6) EmoticonEmoticon