Membuat Multi Dropdown pada Menubar yang sudah Ada

Advertisement
Banyak cara membuat Multi Dropdown dengan menambahkan beberapa CSS baru dan kode baru. Akan tetapi bagaimana cara menambahkan multi dropdown pada menu yang sudah ada? silahkan untuk membuka Kode HTML blognya.



Pada dasarnya kode standar untuk Menu yang ada di blog kita kurang lebih adalah sebagai berikut :

<ul class='menu' id='menunav'>
<li><a class='home' href='/'>Home</a></li>
<li><a href='URL_MENU1' title='MENU1'>MENU1</a></li>
<li><a href='URL_MENU2' title='MENU2'>MENU2</a></li>
<li><a href='URL_MENU3' title='MENU3'>MENU3</a></li>
<li><a href='URL_MENU3' title='MENU4'>MENU4</a></li>
<li><a href='URL_MENU4' title='MENU5'>MENU5</a></li>
</ul>

Jika sobat bingung mencarinya (gunakan ctrl+f) kemudian lakukan pencarian dengan mengetikan nama menu yang sudah ada pada blog sobat, cari sampai ketemu kode html yang mirip-mirip seperti kode diatas.

Pada setiap blog, kode menu berbeda, tapi struktur kodenya kurang lebih seperti itu. Contoh kita ingin menambahkan submenu pada Menu2, maka kodenya akan menjadi seperti ini :

<ul class='menu' id='menunav'>
<li><a class='home' href='/'>Home</a></li>
<li><a href='URL_MENU1' title='MENU1'>MENU1</a></li>
<li><a href='URL_MENU2' title='MENU2'>MENU2</a>
<ul>
<li><a href='URL_SUBMENU' title='SUBMENU'>SUBMENU</a></li>
<li><a href='URL_SUBMENU' title='SUBMENU'>SUBMENU</a></li>
<li><a href='URL_SUBMENU' title='SUBMENU'>SUBMENU</a></li>
</ul>
</li>
<li><a href='URL_MENU3' title='MENU3'>MENU3</a></li>
<li><a href='URL_MENU3' title='MENU4'>MENU4</a></li>
<li><a href='URL_MENU4' title='MENU5'>MENU5</a></li>
</ul>

Keterangan :
Pada MENU2, kode </li> ditempatkan diakhir untuk menutup kode <ul>....</ul> pada SUBMENU. Logika tersebut berlaku juga jika sobat ingin menambahkan SUBSUBMENU pada SUBMENU dan seterusnya



Itu saja tutorial menambahkan submenu pada menu yang sudah ada di blog kita. semoga bermanfaat.
Advertisement

Disclaimer: Gambar, artikel ataupun video yang ada di web ini terkadang berasal dari berbagai sumber media lain. Hak Cipta sepenuhnya dipegang oleh sumber tersebut. Jika ada masalah terkait hal ini, Anda dapat menghubungi kami disini.

Add your comment Hide comment

Disqus Comments