Archive for the ‘Blogger Tricks-Blogger’a Yan Dinamik Menu Oluşturma-1’ Category

Blogger Blog Sitemizin Yan Menüsünü’mü Beğenmiosunuz İşte Size Css Yan Menu Uygulamayı Takip Edin.

Menü Görünümü

1: Yerleşim,Edit/HTML Yani HTML’yi Düzenle Şablon Kodu Kısmına Gelioruz.Witget Şablonunu Genişletmeyi Unutmuoruz
2: CTRL Tuşuna Basılı Tutup F Tuşuna Basıoruz Arama Menusu Çıkıor Resimdede Görüldüğü Gibi.

3:Arama Kutusunu Bulduk </head> Tagını Buluoruz Ve</head> Tagının Hemen Üstüne Aşağıdaki Kodları Yerleştirioruz

Kod:
<style type='text/css'>
#menu15 {
width: 200px;
margin: 10px;
border-style: solid solid none solid;
border-color: #BCD2E6;
border-size: 1px;
border-width: 1px;
}

#menu15 ul {
list-style: none;
margin: 0;
padding: 0;
}

#menu15 img {
border: none;
}

#menu15 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}

#menu15 li a:link, #menu15 li a:visited {
color: #8BADCF;
display: block;
background: url(http://1.bp.blogspot.com/_4HKUHirY_2U/Sxm-5WLofwI/AAAAAAAAAck/DTy4rENfgV8/menu15.gif);
padding: 8px 0 0 10px;
}

#menu15 li a:hover, #menu15 li #current {
color: #627EB7;
background: url(http://1.bp.blogspot.com/_4HKUHirY_2U/Sxm-5WLofwI/AAAAAAAAAck/DTy4rENfgV8/menu15.gif) 0 -32px;
padding: 8px 0 0 10px;
}
</style>

Resimdede Görüldüğü Gibi

4:Bu İşlem Bitti Şablonu Kaydet Save Template Dioruz

5: Edit/HTMLHTML’yi Düzenlede İşimiz Bitti. Şimdi Yerleşim‘e Gelioruz Tıklıoruz.
Resimdede Görüldüğü Gibi

6: Şimdi Yerleşim‘e Geldik Gatget Ekle HTML/JAVASCRİPT Seçioruz
Ve Son Olarak Aşağıdaki Kodları Eklioruz.Kaydet Dioruz

Kod:
<div id="menu15">

<ul>

<li><a id="current" href="#">Home</a></li>

<li><a href="#">HTML</a></li>

<li><a href="#">CSS</a></li>

<li><a href="#">JavaScript</a></li>

<li><a href="#">Templates</a></li>

<li><a href="#">About</a></li>

<li><a href="#">Contact</a></li>

</ul>

</div>

Resimdede Görüldüğü Gibi


Kategoriler