Sitene Kod Ekle | Blogger Eklentileri

Sponsor Siteler* Güncel Blog Yazıları ( Blog Radikal )
* Geniş Kod Arşivi ( Sitene Kod Ekle )
* Şarkı Sözleri ( Sitene Yazılar )
* Deneme Yazıları ( Yazar Edebiyat )
* Sağlık, Moda, Kadın Yazıları ( Yazar Haberi )

Bilindiği üzere Blogger blogspot temaları basit şablonlardan ve eklentilerden oluşuyor. İşte popüler yazılar eklentisi de aynı şekilde basit ve zevksiz bir yapıya sahip. Bloğumuzda bu eklentiye biraz şekil ve güzellik katmak için bir HTML koda ihtiyacımız var. Gelelim bunu nasıl yapacağım? sorusuna. Bunu yaparken çok fazla kod işlerini bilmenize gerek yok. Lafı uzatmadan popüler yazılar gadgetimizi şekillendirelim. Bunu yaparken popüler yazılar gadgetini sitenize eklemeniz gerekir, unutmayın.

Örnek Resim

* İlk önce Blogger ayarlar sayfasından Tema kısmına tıklayalım
* HTML'yi Düzenle butonuna tıklayıp şablonumuzun kodları olan sayfaya gelelim,
* Ardında aradığımız kodu bulmak için CTRL ve F tuşlarına aynı anda basarak bir arama kutusu açalım,
* Şimdi şu ( ]]></b:skin> ) verdiğim kodu buraya yapıştırıp, enter yapalım,
* Aradığımız ( ]]></b:skin> ) kodunun hemen üstüne aşağıda verdiğim kodu yapıştırıp,
* Yukarıda bulunan Kaydet tuşuna basalım. Sitemizin ana sayfasına gittiğimizde popüler yazılar gadgetimizin şeklinin değişmiş olduğunu göreceksiniz. Kolay gelsin...

#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}