Header Ads Widget

Responsive Advertisement

Blogger'e Açılır Üst Menü

Blogger'e Açılır Üst Menü Ekleme Resimli Kolay Anlatım

                                          Blogger İçin Açılır üst Menü Yapma

Blog'larımıza üst menü yaptık , ancak bu menülerin yetersiz geldiğini gördük ve yeni arayışlara girdik. şimdi bu ihtiyacımızı karşılayacak açılır menü yapmamız gerekiyor ama birçoğumuz bunların nasıl yapılabileceğini bilmiyoruz ya da yaparken zorlanıyoruz. Ben sizlere şimdi çok basit bir şekilde blog'umuzun üst tarafına açılır menü nasıl yerleştirilir onu adın adın anlatmaya çalışacağım.
Bunun için sizlere çok basit İki kod vereceğim bu kodları yerleştirebilir ve üzerinde değişiklikler yaparak özelleştirme yapabilme imkanına sahip olacaksınız. Yazı  renklerini değiştirebileceksiniz ayrıca menünüzü genişletebilme imkanına sahip olacaksınız.
Bunu yapmamdaki amaç yeni blogcuların açılır menülerini rahatlıkla ekleyebilmeileri ve renklendirebilmeleri böylece yazılarını büyük bir zevkle yazabilmeleri içindir.

                                           Adım Adım Açılır Menü Oluşturmak 


1-) Bolgger'inizde yönetim panelini açıyoruz. Blogger → Yerleşim Gadget Ekle → HTML/ JavaScript Gadget'ini ekleyip açın.

 2-) Açılan kutucuğa aşağıda verilen kodu kopyalayıp yapıştırınız.

 
<div id='gpnavbar'>
      <ul id='gpnav'>
        <li>
          <a href='#'>Ana sayfa</a>
        </li>
        <li>
          <a href='#'>Hakkımda</a>
       </li>
        <li>
          <a href='#'>İletişim</a>
        </li>
  <li>
           <a href='#'>Ana Menü</a>
            <ul>
                <li><a href='#'>Açılır menü adı #1</a></li>
                <li><a href='#'>Açılır menü adı #2</a></li>
                <li><a href='#'>Açılır menü adı #3</a></li>
              </ul>
        </li>
      </ul>
    </div>
 Eklemek istediğiniz menü URL'sini Larcivet İşaretinin olduğu yere yapıştırınız. 
Eğer menüyü uzatmak isterseniz  ul ile başlayıp ul ile biten kodları kopyalayıp ala yapıştırın ve menünüzü genişletin.

3-) Şimdi CSS kodlarını bulup  aşağıdaki kodları ekleyelim.

Resimdeki yolları izleyin.


 kontrol panelini açın Şablon → HTML Düzenle açıp  

]]></b:skin> kodunu Ctrl+F tuşu ile bulunuz ve bu kodun üstüne aşağıdaki kodu yapıştırınız.Şablonu kaydet.





CSS kodlarını yerleştirmenin başka yolu ise Kontrol panelinde giriş yapın →ŞABLON 
→ ÖZELLEŞTİR  → GELİŞMİŞ → CSS ekle diyin ve kaydedin. Aşağıdaki gibi.

İyi bloglar