Blogger Madde Görünümünü Değiştirmek

08:15 | 0 yorum

Blogger Madde Görünümünü Değiştirin | Blogger Eklentisi

Blogger eklentileri ile blogunuzu modifiye ederek çok daha kullanışlı bir hale getirebilmeniz ve ziyaretçilerini çok sıkmayan bir tema ilekarşılamak bir blog yazarının isteğidir.

Bu eklenti ile klasik blogger madde görünümünden kurtulmuş olacaksınız. Sizinle paylaşacağım bu eklenti ile blogunuzun madde görünümünü daha farklı hale getireceksiniz.

Bu eklentiyi halihazırda bende kullanıyorum. Üzerinde istediğiniz gibi değişiklik yapabilirsiniz.

Her şablonda klasik madde görünümü aşağıdaki gibidir:
Blogger Madde Görünümünü Değiştirmek
Blogunuza bu değişikliği uygulamak için;

blogunuzun şablon bölümüne girin
]]></b:skin> kodunu bulun ve aşağıdaki kodu ]]></b:skin kodunun üzerine yapıştırın.

.post ul {list-style:none;
}
.post ul li {
line-height: 1.4em;
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRZf5Af5tszGk6QWQn2cvKLxZ5z-0mKGmFOZrMCZBraQtQFbyXgQoLsvEp3Jb5wYPhRUCvmDu-xywTbjvLmKfXxsBPPNWYNlzcBWJ-tA3TVguLfzQKpRvFz3QiEf-WrYw4mPWXz8T1Ahw/s400/255.gif) no-repeat scroll 0px 4px;
margin: 0.3em 0;
padding: 0 0 0.8em 20px;
}
.post ul li:hover {
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji29GoKbPhKFOKUCKKDakeEx8C1-9gF5CvZTrvktra-TgUek0kwJu4EtkAi98-nt1JWgt0qLcdi-GckuFHibPBTVqaOpoMLDQbsIIoizFGKXFJLzmjfhZIUO3fAdZv9b6WtPbfTfAkO5o/s400/251.gif) no-repeat scroll 0px 4px;
}
Yukarıda mavi ile işaretlediğim alanlar madde görünümün ikonları. 1. ikon maddenin ilk görünümü 2. ikon ise üzerine geldiğinizde renk değiştirecek. Ön izlemesini ekledim. Merak edenler bakıp nasıl göründüğünü kontrol edebilirler.

Not: İkonları istediğiniz gibi değiştirebilirsiniz. İkon arşine http://www.iconarchive.com/ linke tıklayarak erişebilirsiniz.

Size önerebileceğim ikonlar:

http://www.iconarchive.com/show/silk-icons-by-famfamfam/bullet-blue-icon.html
http://icons.iconarchive.com/icons/famfamfam/silk/16/bullet-blue-icon.png
http://icons.iconarchive.com/icons/famfamfam/silk/16/bullet-purple-icon.png
http://icons.iconarchive.com/icons/famfamfam/silk/16/bullet-pink-icon.png
http://icons.iconarchive.com/icons/famfamfam/silk/16/bullet-red-icon.png

Tek tek inceleyip farklı bir tasarım yaratabilirsiniz.

Kategori: , ,

0 yorum