1. Login dulu ke blog anda.
2. pilih rancangan kemudian edit Html.
3. kemudia beri tanda centang pada Expand template widget.
4. lalu cari kode berikut ]]></b:skin>. untuk mempermudah mencarinya gunakan CTRL + F.
5. lalu copy pastekan kode/script ini (dibawah ini) tepat di atas/sebelum kode ]]></b:skin>.
#navbarmenu{width:auto; float:left;
font-size:12px; background:#fff;
font-weight:bold; margin:0 auto; padding:0 auto} #nav{margin:0; padding:0} #nav
ul{float:left; list-style:none; margin:0; padding:0} #nav li{list-style:none;
margin:0; padding:0; background:none} #nav li a, #nav li a:link, #nav li
a:visited{color:#000000; display:block; font-weight:normal;
text-transform:normal; margin:0; padding:5px 15px 5px} #nav li
a:hover{background:#99FF00; color:#FFF; margin:0; -moz-border-radius:8px;
padding:5px 15px 5px; text-decoration:none} #nav li li a, #nav li li a:link,
#nav li li a:visited{background:#FFF; -moz-border-radius:8px; width:150px;
color:#00000; font-weight:normal; text-transform:normal; float:none; margin:0;
padding:5px 10px 5px 15px; border-bottom:1px solid #fff; border-left:1px solid
#fff; border-right:1px solid #fff} #nav li li a:hover{background: #99ff00;
color:#FFF; padding:5px 10px 5px 15px} #nav li{float:left; padding:0} #nav li
ul{z-index:9999; position:absolute; left:-999em; height:auto; width:170px;
margin:0; padding:0} #nav li ul a{width:140px} #nav li ul ul{margin:-25px 0 0
171px} #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav
li.sfhover ul ul ul{left:-999em} #nav li:hover ul, #nav li li:hover ul, #nav li
li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li
li.sfhover ul{left:auto} #nav li:hover, #nav li.sfhover{position:static}
7. lalu kembali ke Rancangan/ Element laman dan tambah Gadget dibawah header lalu pilih Html/Java Script
8. lalu pastekan kode/script dibawah ini:
<div class='menuhorisontal'>
<ul id='nav'>
<li><a
href='http://dhityadhizt0.blogspot.com/'>HOME</a> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Keluarga</a>
<ul>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Liburan</a> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
</ul> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Sejarah</a>
<ul>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a></li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
</ul> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Pendidikan</a>
<ul>
<li><a href='http://dhityadhizt0.blogspot.com/'>Empty</a>
</li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a></li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
</ul> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Agama</a>
<ul>
<li><a href='http://dhityadhizt0.blogspot.com/'>Empty</a>
</li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a></li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
</ul> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Orkesmas</a>
<ul>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a></li>
<li><a
href='http://dhityadhizt0.blogspot.com/'>Empty</a> </li>
</ul> </li>
<li><a href='#'>ABOUT ME</a>
<ul>
<li><a href='http://www.facebook.com/ddhizt'>ME
ON FACEBOOK</a> </li>
<li><a href='https://twitter.com/ddhizt'>ME ON
TWITTER</a> </li>
</ul> </li>
</ul>
</div>
KETERANGAN:
#warna merah merupakan URL untuk menu utama, dapat anda ganti dengan URL yang akan anda tujukan.
#warna biru merupakan URL untuk Sub-sub menunya, dapat anda ganti dengan URL yang akan anda tujukan.
#dan yang dicetak tebal merupkan Nama URL tersebut uang akan muncul di menunya, ganti sesuai keinginan.
apabila ingin menambah menunya, tinggal tambah saja, bisa dianalisa dari script diatas.
9. lalu simpan dan lihat hasilnya.
SELESAI
0 komentar:
Posting Komentar