Blogger Popüler Yayınlar Eklentisi [ Numaralı Widget ]

Blogger Popüler Yayınlar Eklentisi [ Numaralı Widget ]

Blogger 2011'de Popüler Yayınlar widgetini yeniden yayınladığında blogspot kullanıcıları css ile widgete ilham verdi.Bugün ise CSS3'ünde desteğiyle blogspot kullanıcıları daima bir adım önde.
Popüler yayın eklentisi olan bu widgette numaralarında otomatik olarak yapılıyor.

Kurulum : 

1.Blogger Yönetici Panalenizi Açın > Sol Kısımda bulunan menülerden 'Yerleşim'e tıklayın.

2.'Gadget Ekle' yazısına tıklayın.

3.Çıkan eklentilerden 'Popüler Yayınlar' gadgetini ekleyin.

4. Gadget Ayarları Resimdeki gibi olucak. ( Resimdeki kelimeler ingilizcedir.)

5. Yine sol kısımda bulunan menülerden 'Tema'ya tıklayın.

6.Tıkladığınız sayfadan 'HTML'yi Düzenle' butonuna tıklayın.

7. 'CTRL + F' yardımıyla </b:skin> kelimesini aratın.

8. Aşağıdaki kodu </b:skin> kodunun bir satır üstüne ekleyin.

/*--- ZYMY-Design Popüler Yayınlar Eklentisi 23.07.2019 --- */ 
.popular-posts ul { 
padding-left: 0px; 
counter-reset: popcount; 
}

.popular-posts ul li:before { 
list-style-type: none; 
margin-right: 15px; 
padding: 0.3em 0.6em; 
counter-increment: popcount; 
content: counter(popcount); 
font-size: 16px; 
background: #292D30; 
color: #ffffff; 
position: relative; 
font-weight: bold; 
font-family: georgia; 
float: left; 
border: 2px solid #dddddd; 
box-shadow: 1px 2px 9px #666666; }

.popular-posts ul li { 
border-bottom: 1px dashed #dddddd; 
}

.popular-posts ul li:hover { 
border-bottom: 1px dashed #696969; 
}

.popular-posts ul li a { 
text-decoration:none; color:#5A5F63; 
}


.popular-posts ul li a:hover { 
text-decoration:none; 
}

Önizleme adresinde widget renk ve tasarım konusunda değişiklilik gösterebilir çünkü still dosyası üzerinde oynama yaptığımız içindir.

Önizleme Demo

NOT: Karşılaşabileceğiniz herhangi bir problem durumunda blog sayfamızda bulunan 'iletişim' veya 'yorum' kımsından yardım talep edin.

Blogger Sayfanız İçin Öneriyoruz : Blogger Önerilen XML Site Haritası Nasıl Kullanılır ?