3 Ekim 2011 Pazartesi

Blogger’a Yatay Link Menüsü Ekleme

Herkese merhaba,

Fashion S.O.S blogunun yazarı Ece Köprübaşılı, bir yorumunda blogunda başlığın hemen altına yatay menü ekleme ile ilgili yardım talep etmişti.Bende bu yazımda blogunuza nasıl yatay menü ekleyeceğinizi anlatacağım.

blogger yatay menu ekleme

Resimdeki gibi blog başlığınızın hemen altına yatay menü eklemek için öncelikle şablonunuza menünün görünümünü belirteceğiniz CSS kodlarını eklemelisiniz.CSS kodlarını her zaman olduğu gibi ]]></b:skin> kodunun hemen üstüne ekliyorsunuz.Eklemeniz gereken CSS kodları ise şunlar:

 

#newnavbar ul li{
font-size:100%;
list-style-type: none;
display:inline;
padding:0px;
margin:10px;
border:0px solid;
}

#newnavbar li a{
color:#000000;
}

#newnavbar li a:visited {
color: #c00000;
}

#newnavbar li a:hover {
color: #c00000;

}




  • Ana sayfa, link1, link2 gibi linklerin siyh olan rengini değiştirmek için newnavbar li a kodundaki #000000 olan renk kodunu değiştirebilirsiniz.


  • Linklerin üzerine geldiğinizde linkler kırmızı renge dönüşüyor.O rengi değiştirmek için ise newnavbar li a:hover kodundaki #c00000 olan renk kodunu değiştirebilirsiniz.



İkinci adımda ise menünün HTML kodlarını ekleyeceksiniz.Bunun için blogunuzun sayfa öğelerini açın ve sayfa öğelerindeki Üstbilgi bölümünün altındaki Gadget Ekle’ye basarak HTML/JavaScript’i seçin ve asşağıdaki kodları ekleyin.



blogger-gadget



<div id='newnavbar'>
<ul>
<li><a href="http://bloghocam.blogspot.com">Ana Sayfa</a></li>
<li><a href="Link1">Link1</a></li>
<li><a href="Link2">Link2</a></li>
<li><a href="Link3">Link3</a></li>
<li><a href="Link4">Link4</a></li>
<li><a href="Link5">Link5</a></li>
</ul></div>


İşte blogunuza yatay link menüsü eklemek bu kadar.Umarım net bir şekilde anlatabilmişimdir.

Hiç yorum yok:

Yorum Gönder