Home » » Blogger Widgetlerine Scroolbar Ekleme

Blogger Widgetlerine Scroolbar Ekleme

Blogger'da bazı widgetler  çok uzun olduğu için aşırı yer kaplayıp çirkin bir görüntü oluşturuyor.Bu durumu güzel  bir Scroolbar ekleyerek güzelleştirebiliriz.

Genellikle Etiketler,Popüler  yayınlar,Hiyerarşik blog arşivi için kullanmak uygun düşüyor.bunu yapmak için bir kaç css kodunu temamıza eklemek yetecektir.
Önce ]]></b:skin> kodunu  buluyoruz ve üzerine aşağıdaki kodları ekliyoruz.


#WidgetID ul{
max-height:200px;
overflow:auto;
}
#WidgetID ul::-webkit-scrollbar {
height:12px;
width: 12px;
background: #333;}
::-webkit-scrollbar-thumb {
background-color: #ccc;
-moz-border-radius: 10px;
border-radius: 10px;
}
 Yukarıdaki kodlarda max-height:200px; kodunda widgetimizin maximum yüksekliğinin değerini yazıyoruz.200 yazılmış  siz 300-400 kaç px olmasını istiyorsanız öyle  yazın.
sırada WidgetID kısmına widgetimizin id  sini yazacaz.peki widget id  mizi nasıl bulucaz.
widgetimizi açıyoruz ve yandaki resimdeki gibi widgetid mizi   alıyoruz.ve kodlardaki widgetid yazan yere  yapıştırıyoruz. örnek şu şekilde:

#PopularPosts1 ul{
max-height:200px;
overflow:auto;
}
#PopularPosts1 ul::-webkit-scrollbar {
height:12px;
width: 12px;
background: #333;}
::-webkit-scrollbar-thumb {
background-color: #ccc;
-moz-border-radius: 10px;
border-radius: 10px;
}

temayı kaydet diyip çıkıyoruz.
Demo: Video.radyolojiteknikerleri.com sitenin sağ alt köşesindeki arşiv widgetine bakın.

0 yorum:

Yorum Gönder