Pembuatan Menu Horizontal Dropdown ini cukup mudah anda tinggal tambah Gadget HTML/Javascript kalau gak ngerti silahkan baca caranya Disini dan area penempatan menu ini harus lebar agar menunya pas dan cocok.
Simpan dalam Gadget HTML/Javscript
<style>
/* Editing: SysteM Of BloG */
#menu {list-style-type:none; margin:5px; padding:0;}
#menu li {float:left; padding:0; margin:0 1px 0 0; position:relative; width:200px; height:3em; z-index:100;}
#menu li dl {position:absolute; top:0; left:0;padding-bottom:5px;}
#menu li a, #menu li a:visited {text-decoration:none;}
#menu li dd {display:none;}
#menu li a:hover {border:0;}
#menu li:hover dd, #menu li a:hover dd {display:block;}
#menu li:hover dl, #menu li a:hover dl {padding-bottom:10px;}
#menu table {border-collapse:collapse; padding:0; margin:-1px; font-size:1em;}
#menu dl {width: 200px; margin: 0; padding: 0; background: #c9ba65;}
#menu dt {margin:0; padding: 5px 5px 5px 20px; font-size: 1.1em; color: #b60000; border-bottom:1px dashed darkred; border-top:1px dashed gray; text-align:center;}
#menu .one {background: #000; border-top:5px dashed #b60000;}
#menu .two {background: #000; border-top:5px dashed #b60000;}
#menu .three {background: #000; border-top:5px dashed #b60000;}
#menu .four {background: #000; border-top:5px dashed #b60000;}
#menu .one dt {background: black;}
#menu .two dt {background: black;}
#menu .three dt {background: black;}
#menu .four dt {background: black;}
#menu dd {margin:0; padding:0; color: #000; font-size: 1em; text-align:center;}
#menu .one dd {border-bottom:1px dashed darkred;}
#menu .two dd {border-bottom:1px dashed darkred;}
#menu .three dd {border-bottom:1px dashed darkred;}
#menu .four dd {border-bottom:1px dashed darkred;}
#menu dd.last {border-bottom:1px dashed darkred;}
#menu dt a, #menu dt a:visited {display:block; color:green;}
#menu dd a, #menu dd a:visited {color:darkred; text-decoration:none; display:block; padding:4px 5px 4px 20px; width:170px;}
#menu .one dd a {background:black; color:green;}
#menu .two dd a {background:black; color:green;}
#menu .three dd a {background:black; color:green;}
#menu .four dd a {background:black; color:green;}
#menu .one dd a:hover {background: #665; color:#000;}
#menu .two dd a:hover {background: #665; color:#000;}
#menu .three dd a:hover {background: #665; color:#000;}
#menu .four dd a:hover {background: #665; color:#000;}
</style>
<ul id="menu"><!-- drop down menu start -->
<li>
<!--[if lte IE 6]><a href="#Link"><table><tr><td><![endif]-->
<dl class="one">
<!-- Alter the links with your own -->
<dt><a href="Link kepala Anda Disini">Nama Link Kepala</a></dt>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#Link"><table><tr><td><![endif]-->
<dl class="two">
<dt><a href="Link Anda Disini">Nama Link Kepala</a></dt>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#Link"><table><tr><td><![endif]-->
<dl class="three">
<dt><a href="Link Anda Disini">Nama Link Kepala</a></dt>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href="#Link"><table><tr><td><![endif]-->
<dl class="four">
<dt><a href="Link Anda Disini">Nama Link Kepala</a></dt>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
<dd><a href="Link Anda Disini">Nama Link drop down</a></dd>
</dl>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul><!-- end of drop down menu -->Setelah anda copy silahkan klik SIMPAN
