Blogger İçin CSS Açılır Menü Yapmak

Bu yazımızda blogger'ciler için düzenlenmiş olan CSS açılır menü nasıl uygulanır onu anlatacağım:

CSS

Demosuna bakmak isterseniz kendi sitemde bu menü mevcuttur farkettiyseniz hemen anlatıma geçelim:

Blogger kumanda paneline giriş yapınız şablon sekmesinden HTML' yi düzenle > Devam et butonuna tıklayınız kodlar içerisinde <head> kodunu aratın ( Ctrl+F ) ve hemen altına gelecek vaziyette aşağıdaki kodumuzu ekleyelim:

css menü

Şablonu kaydedin kumanda paneli Gatget ekle HTML Javasicript yolunu takip ederek aşağıdakiş HTML Kodlarını ekleyin >>>

<ul class='menu'><li class='no_drop'><a href='http://www.ibrahimfirat.net/'>Ana Sayfa</a></li>
<li class='no_drop'><a href='http://www.ibrahimfirat.net/p/iletisim.html'>İletişim</a></li>
<li class='no_drop'><a href='http://www.ibrahimfirat.net/p/site-haritas.html'>Arşiv</a></li>
<li class='no_drop'><a href='http://www.ibrahimfirat.net/p/sohbet_03.html'>Sohbet</a></li>
<li class='no_drop'><a href='http://www.ibrahimfirat.net/p/oyun.html'>Oyun</a></li>
<li><a class='drop' href='#'>Kategoriler</a> <br />
<div class='dropdown_1column'><div class='col_1'><ul><li><a href='http://www.ibrahimfirat.net/search/label/blogger'>Blogger</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/wordpress'>WordPress</a></li>
<li><a href='http://www.ibrahimfirat.net/2012/09/webmaster-genel-konular.html'>Webmaster</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/seo'>SEO</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/pc%20teknik?max-results=10'>Bilgisayar Teknik</a></li>
<li><a href='http://www.ibrahimfirat.net/2012/07/siteni-tant.html'>Siteni Tanıt</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/tan%C4%B1t%C4%B1m'>Tanıtım</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/yaz%C4%B1l%C4%B1m'>Yazılım</a></li>
<li><a href='http://www.ibrahimfirat.net/'>Sosyal Ağlar</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/proxy%20list'>Proxy List</a></li>
<li><a href='http://www.ibrahimfirat.net/2012/09/tum-kategoriler.html'>GeneL Kategori</a></li>
</ul></div></div></li>
<li><a class='drop' href='#'>Araçlar</a><br />
<div class='dropdown_2columns'><br />
<div class='col_1'><h3>Karısık</h3><ul><li><a href='http://www.ibrahimfirat.net/2012/08/meb-genel-bilgiler.html'>MEB</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/sagl%C4%B1k'>Sağlık</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/sinema'>Sinema</a></li>
</ul></div><br />
<div class='col_1'><h3>Çeşitli</h3><ul><li><a href='http://www.ibrahimfirat.net/2012/06/astroloji-burclar-fal-gunluk-burc.html'>Astroloji</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/dini%20bilgiler'>Din</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/yaz%C4%B1l%C4%B1m'>Yazılım </a></li>
</ul></div><br />
<div class='col_1'><h3>Sosyal Medya</h3><ul><li><a href='http://www.ibrahimfirat.net/search/label/facebook'>Facebook</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/twitter'>Twitter</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/Google'>Google+</a></li>
</ul></div><br />
<div class='col_1'><h3>Linkler</h3><ul><li><a href='http://www.ibrahimfirat.net/search/label/moda'>Moda</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/G%C3%BCzellik'>Guzellik</a></li>
<li><a href='http://www.ibrahimfirat.net/search/label/Dekorasyon'>Dekorasyon</a></li>
</ul></div></div></li>
</ul>

Yapmanız gereken işlemler bu kadar HTML Kodlarının içindeki linkleri kendini sitenize göre düzenleyiniz..

Hiç yorum yok:

Yorum Yazmak İçin Aşağıdaki Seçenekleri Kullanınız

Lütfen konuyla alakasız yorumlardan kaçının. Sadece link almak amaçlı ( spam ) yorumlar yazmayınız. ( anında silinir ). Argo, küfür, siyasi vb. içerik barındıran yorumlar yazmayınız.

Not: Yorum yapabilmek için (yorumlama biçiminden) Anonim ( isimsiz olarak ) veya Adı/URL'yi ( Adı ( gerekli ) / URL ( kısmını boş bırakınız ), fonksiyonlarından seçim yaparak yorumlarınızı yazabilirsiniz.

Ancak Google + profili ile yapılan yorumları onaylamıyorum bilginize. Yorum yaparken Adı/URL kısmından yaparsanız sadece isim yazmanız yeterli. Site adresi, URL eklerseniz yorumunuz onaylanmaz.

Sponsor Alanı

Slider

İlgi Çeken Videolar

Sağlık

Teknoloji

Sinema

Televizyon

Ne Nedir?

En5 Konular

Ads1

11 Ekim 2012