Cara Membuat Navigator Menu Horizontal (PALING MUDAH)

cara bikin navigator menu horizontal udah pada tau belom ? jangan jangan malah ada yang belom tau navigator menu horizontal itu apa ? oh my goat oh my god. kalo di blog ini tuh liat di bagian kiri atas, ada tulisan Home, Facebook, Twitter, Blogger. nah itu dia navigator menu horizontal.
cara bikinnya ? ada cara mudah, ada cara ribet. kita bahas yang paling mudah dulu ya
pertama ke menu Design terus pilih Page Elements terus pilih Add a Gadget lalu HTML/JavaScript
masukkan kode ini

<ul class="menu red">
<li class="current"><a href="http://www.sfv-gratis.blogspot.com" target="_self">Home</a></li>
<li><a href="http://www.facebook.com/mukhtar.rafi.fauzi.hehehe" target="_self">Facebook</a></li>
<li><a href="http://www.twitter.com/rafifauzi1923" target="_self">Twitter</a></li>
<li><a href="http://www.blogger.com" target="_self">Blogger</a></li>
<li><script type="text/javascript"
src="http://www.seocentro.com/geo/geocf.pl">
</script></li>
</ul>

perhatikan yang ane bold, itu bisa diganti ganti sesuai keinginan agan agan. udah ngerti kan ? mantap. klik save.

lalu cara ribetnya ? nah ini buat para master master pake ini aja ya wkwk

pertama pilih Design lalu klik Edit HTML terus centang Expand Widget Templates
terus cari kode

]]></b:skin>

terus copy kode dibawah ini, tepat diatas kode diatas

.menuhorisontal{
width: 100%;
overflow: hidden;
border-bottom: 1px solid #000000;
}

.menuhorisontal ul{
margin: 0;
padding: 0;
padding-left: 10px;
font: bold 12px Verdana;
list-style-type: none;
}

.menuhorisontal li{
display: inline;
margin: 0;
}

.menuhorisontal li a{
float: left;
display: block;
text-decoration: none;
margin: 0;
padding: 7px 8px;
border-right: 1px solid white;
color: white;
background: #414141; /*background dari Tabel*/
}

.menuhorisontal li a:visited{
color: white;
}

.menuhorisontal li a:hover, .menuhorisontal li.selected a{
background:#002EB8; /*Background Setelah Pointer Diarahkan */
}
#footheader {
width: 100%;
float:left;
margin:0 0 0;
padding:0 0 0;
height:35px;
}

terus cari kode ini

<div id='header-wrapper'>

abis itu copy kode dibawah ini, tepat dibawah kode diatas

<div id='footheader'>
<b:section class='footheader' id='footheader' preferred='yes'>
</b:section>
</div>

Klik Save

nah belom selesai sampe situ, liat ke Page Elements muncul area gadget baru kan ? nah itu nanti kita pake lagi cara paling mudah diatas. ngerti ? oke sip. mantap