Membuat Menu Horizontal Drop Down di Blog

Posted by Rezqy Dwikara Goratama 29 Maret 2012

Membuat Menu Horizontal Drop Down di Blog - Menu Horizontal Drop Down adalah Menu yang berbentuk memanjang dan jika kita menyorot mouse di menu tersebut maka akan keluar anak - anak dari sub menu tersebut .

Menu ini sangat berguna bagi blog, karena saat pengunjung mencari kategori artikel yang dicari, bisa langsung mencari di menu drop down tersbut.


Jika ingin Memasang di blog anda silahkan ikuti langkah - langkah berikut ini :


1. Login Blogger
2. Masuk ke " Template > Edit Html "
3. Cari kode ]]></b:skin> Jika sudah ketemu, copy kode dibawah ini, dan paste diatas code ]]></b:skin>


#NavbarMenuAtas{ background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj90h2X9CJVqCQ-6kZd79YqJq19OmxbFsiZNLkANDQ9g8w2X2yj_V1LgPtAf0mlCfrWJ_iIz18HTaKl2EuyBjd2hrQPlj5_ebt2yOrRSiTBZXhE17FSq6eVrq2Uk0Zk13CoSe3e66c82sGG/?imgmax=800) repeat-x;width:960px; height:40px; color:$navcolor; margin:0 auto; font: bold 8px Arial, Tahoma, Verdana;}
#NavbarMenuAtasleft{ width:650px; float:left; }


4. Cari Kode <div id='header'> atau <div id='header-wrapper'> . Jika sudah ketemu copy kode di bawah ini dan taruh di atas kode <div id='header'> atau <div id='header-wrapper'>

<div id='NavbarMenuAtas'>
       <div id='NavbarMenuAtasleft'>
      <ul id='nav'>
        <li><a expr:href='data:blog.homepageUrl'>Home</a></li>
        <li>
          <a href='#'>Page #1</a>
          <ul>
            <li><a href='#'>Sub Page #1</a></li>
            <li><a href='#'>Sub Page #2</a></li>
            <li><a href='#'>Sub Page #3</a></li>
          </ul>
        </li>
        <li><a href='#'>Page #2</a></li>
             <li><a href='#'>Sub Page #1</a></li>
            <li><a href='#'>Sub Page #2</a></li>
            <li><a href='#'>Sub Page #3</a></li> 
      </ul>
    </div>
  </div>


Anda bisa merubah :
  • Yang berwarna Hijau dengan Sub Menu
  • Yang berwarna Biru dengan Menu
  • Yang berwarna Merah dengan link tujuan Menu

5. Simpan


Mungkin beberapa template tidak mendukung Menu Drop Down ini.


Selamat mencoba - Membuat Menu Horizontal Drop Down di Blog



Description: Membuat Menu Horizontal Drop Down di Blog
Rating: 5
Reviewer: 98827 ulasan
Item Reviewed: Membuat Menu Horizontal Drop Down di Blog
Peluang Bisnis Online

Baca Juga Artikel Ini :