1. Pada dasbor
klik yang ditunjuk oleh kursor, lalu pilih template seperti pada gambar di
bawah ini
2. Lalu nanti
akan muncul tamilan seperti ini, klik Edit HTML
4. Letakkan
kode cascading style sheet dibawah
kode yang diberi lingkaran seperti ditunjukkan oleh gambar 1 berikut.
# Kode cascading
style sheet
/* Horizontal menuku */
.menu{
border:1px solid #000000;
margin:0px;
padding:0px;
font: 67.5% "Lucida Sans Unicode", "Bitstream
Vera Sans", "Trebuchet Unicode MS", "Lucida Grande",
Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
}
.menu ul{
background:#333333;
height:35px;
padding:0;
margin:0;
list-style: none;
}
.menu li{
float:left;
padding:0px;
.position: relative;
}
.menu li a{
background:#333333;
color:#000000;
padding:0px 25px;
text-decoration:none;
display:block;
font-weight:normal;
line-height:35px;
margin:0px;
text-align:center;
}
.menu li a:hover{
background:#2580a2;
color:#FFFFFF;
text-decoration:none;
}
.menu li ul{
background:#333333;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:225px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul {
display:block;
.float:none;
.padding;opx;
.position:absolute;
.top:41px;
.left:0;
}
.menu li:hover li{
display:block;
background:#000000;
float:none;
margin:0px;
padding:opx;
}
Tampilan Dropdown
Menu
5. Simpan
Template atau perubahan kode HTML
kode menu dropdown
<div class="menu">
<ul>
<li><a
href="http://teknikkublogku.blogspot.com/"><span>HOME</span></a></li>
<li><a
href="http://blokula.blogspot.com/"><span>LAN</span></a>
<ul>
<br />
<li><a
href="http://ridakusayang.blogspot.com/">PERANGKAT
LAN</a></li>
<li><a
href="http://topo-logi.blogspot.com/">TOPOLOGI
JARINGAN</a></li>
<li><a
href="http://internet-protokol.blogspot.com/">IP
ADDRESS</a></li>
<ul>
</ul></ul></li>
<li><a
href="http://nggonkula.blogspot.com/"><span>WAN</span></a>
<ul>
<br />
<li><a
href="http://wan-i-piro.blogspot.com/">PERANGKAT
WAN</a></li>
<li><a
href="http://ethernet-internet.blogspot.com/">ETHERNET</a></li>
<ul>
</ul></ul></li>
<li><a
href="http://singduweaku.blogspot.com/"><span>JARINGAN</span></a>
<ul>
<br />
<li><a
href="http://blog-geringan.blogspot.com/">MACAM MACAM
JARINGAN</a></li>
<li><a
href="http://type-jaringan.blogspot.com/">TYPE-TYPE
JARINGAN</a></li>
<ul>
</ul></ul></li>
<li><a
href="http://kuladuwe.blogspot.com/"><span>S
O</span></a>
<ul>
<br />
<li><a
href="http://accountkula.blogspot.com/">KONSEP
DASAR</a></li>
<li><a
href="http://sistemkula.blogspot.com/">PENGERTIAN
WINDOWS</a></li>
<li><a
href="http://lay-anan.blogspot.com/">PENGERTIAN
LINUX</a></li>
<li><a href="http://boot-ting.blogspot.com/">BOOTING</a></li>
<li><a
href="http://erandbie.blogspot.com/">KEDUDUKAN S
O</a></li>
<li><a
href="http://dirbloger.blogspot.com/">PERINTAH INTERNAL
COMMAND</a></li>
</ul>
</li>
<li><a href="http://ridakula.blogspot.com/"><span>LAIN-LAIN</span></a></li>
</ul>
</div>
6. Letakkan
kode menu drop
down di tempat yang diinginkan misalkan dibawah gadget header.
7. Klik
tombol SIMPAN
8. Selesai