Cara Membuat Menu Drop Down Pada Blog

Halo Sobat Yuira
                   Pasti salah satu dari kalian ada yang masih bingung nih cara membuat menu drop down di blog. Contoh hasil menu drop downnya dapat kalian lihat pada blog kami. Nantinya menu drop down kalian yang akan dibuat adalah persis seperti milik kami, hanya saja drop downnya dapat kalian tambah ataupun kurangi sendiri.. Langsung saja deh, nih caranya

1. Buka Template pada Blogger.com
2. Lalu edit html
3. centang Expand Template Widget

4. Kemudian copy kan code di bawah ini, diatas <div class='main-outer'>

 <style>
/* -- Menu Horizontal + Sub Menu-- */
#cat-nav {background:#800000;margin:0 15px;padding:0;height:35px;}
#cat-nav a { color:#eee; text-decoration:none; text-shadow: #033148 0px 1px 0px;border-right:1px solid #800000;}
#cat-nav a:hover { color:#fff; }
#cat-nav li:hover { background:#000; }
#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}
#cat-nav .nav-description { display:block; }
#cat-nav a:hover span { color:#fff; }
#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#0d5e88; }
#secnav a { font-family:Georgia, &quot;Times New Roman&quot;, Times, serif; font-style:italic; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}
#secnav li { float:left; width: auto; height:35px;}
#secnav li ul  { position: absolute; left: -999em; width: 200px; top:35px}
#secnav li ul li  { height:30px; border-top:1px solid #fff; }
#secnav li ul li a  { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }
#secnav li ul ul  { margin: -30px 0 0 180px; }
#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }
#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }
#secnav li:hover,#secnav li.hover  { position:static; }
#cat-nav #secnav {width:100%;margin:0 auto;}
</style>
<div id='cat-nav'>
<ul class='fl' id='secnav'>
<li><a href='remodonline.blogspot.com'>Home</a></li>
<li><a href='Isi Alamat Web Kalian'>Menu 1</a>
<ul id='sub-custom-nav'>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 1</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 2</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 3</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 4</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 5</a></li>
</ul>
</li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Menu 2</a>
<ul id='sub-custom-nav'>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 1</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 2</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 3</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 4</a></li>
</ul>
</li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Menu 3</a>
<ul id='sub-custom-nav'>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 1</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 2</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 3</a></li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>Sub Menu 4</a></li>
</ul>
</li>
<li><a href='Isi Alamat Web Yang ingin kalian tuju'>About Me</a></li>
</ul>
</div>

5. Kemudian Klik Simpan

PERLU DIINGAT, EDIT DULU "ISI ALAMAT WEB YANG INGIN KALIAN TUJU", DAN INGAT JUGA SETIAP LINK HARUS ADA TANDA KOMA ATAS, CONTOH ('www.google.com')

#hilangkan tanda ( )

seperti itu sobat yuira, jika tulisan Menu, Sub Menu dapat langsung dirubah tanpa menambahi apa apa. Semoga Berhasil...

NB: Jika ada yang kurang jelas, bisa corat coret di kolom Komentar
 
 

BILA POSTING INI BERMANFAAT TOLONG BERIKAN G+1 DAN ADMIN AKAN SANGAT BERTERIMA KASIH.  

APA ITU G+1 ???