Membuat Menu Horizontal Drop Down di Blog
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>
<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>
<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 |