Blog için scrollbar eklentisi

2/21/2016
Blogger blogspot scrollbar

Blog için scrollbar eklentisi - Blogunuzda yayınladığınız içerikler gün geçtikçe çoğalmakta ve çok yer kaplar hale gelmiştir. Bunlar arasında kategoriler en başta gelmekte ve site içi dolaşımını da engeller duruma getirmiştir. Bir çok blog kullanıcısı bu konuda bilgilere sahip olsa da yeni başlayanlar için sıkıntı oluşturmaktadır.

Blogger Blogspot Scrollbar


Yeni blog yazarları için ayrıntılı olarak anlatmaya çalışacağımız blog için scrollbar CSS eklentisini nasıl oluşturacağız?

Blogunuzda kategoriler oluşturuyorsunuz ve içerik çok olduğu için bunu overflow: auto gibi küçük bir kod olan overflow ile giderebiliyoruz.

Resimlerde de gördüğünüz gibi overflow ile oluşturduğumuz scrollbarımızı farklı tasarımlar kazandırmak istiyoruz. Tabiki şunu belirtelim öncelikle blogunuzda ilgili HTML kodlar için CSS kodları içerisinde overflow: auto olmalıdır.

Blogger Blogspot Sayfasına Scrollbar Nasıl Eklenir?


Blogunuzda kumanda paneline giderek Tema > HTML'i Düzenle kısmından CTRL+F yardımıyla ]]></b:skin> yada </style> kodunu bulalım ve aşağıda bulunan CSS kodunu ]]></b:skin> yada </style> kodunun hemen bir üst kısmına ekleyelim ve şablonu kaydet diyelim.

::-webkit-scrollbar {
    border-radius: 5px;
    width: 10px;
    height: 10px
}
::-webkit-scrollbar-track {
    background-color: #ddd;
}
::-webkit-scrollbar-thumb:hover {
    background-color: #888;
}
::-webkit-scrollbar-thumb {
    background-color: #999;
    transition: all 400ms ease-in-out
}

Bu kadar. Kod içerisinde renkli kısımlarla belirtmiş olduğum yerlerden daha farklı görünümler sağlayabilirsiniz.

Kategori İçerikleri



Blogger
Disqus
Yorum Ekle

Hiç yorum yok