Menu Navigasi Horizontal Cantik

LANGSUNG AJA KE TKP................... Bosan ngasih keterangan singkat karena sebagian udah tau apa itu menu navigasi, yang ada pada blog blog... seperti Home-About-Contact dan lain lainnya... HEHE... Dan anda pasti udah tau pertama kali anda harus edit html dan centeng widget template dan di backup dulu supaya tidak terjadi ERRORR ya kan...

 Menu Navigasi Horizontal Cantik

1.Cari kode ]]></b:skin> 
2.Letakkan kode html ini diatasnya

ul#menu{ margin:0; padding:0; list-style-type:none; width:auto; position:relative; display:block; height:36px; text-transform:uppercase; font-size:12px; font-weight:bold; background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQmFIWqMtLFPUZaK5c_bzAesI4fuyNDzdCEWPXR9YELmigW5-r3Vu8iIa3l4eUxUrWvhWLk_Z_mgG-RNW5UsyJaAARzUnBXy3p3iURGdg7VyHfsYogZ9EvqQ-NA4iBctiYNNyXbLYXn2At/s320/OFF.gif") repeat-x top left; font-family:Helvetica,Arial,Verdana,sans-serif; border-bottom:1px solid #74b0c6; border-top:1px solid #74b0c6; } ul#menu li{ display:block; float:left; margin:0; pading:0;} ul#menu li a{ display:block; float:left; color:#6d7078; text-decoration:none; font-weight:bold; padding:12px 20px 0 20px; height:24px; background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDe5j9B8j8m3R0m1u0XyX-skBgbq0slCUEhhje3ZKLKhzcWM0UKo0otNN16grSMPwByHucNekA3iQUqq2DwagIGppfmI2nQKnMnrYZUuFYWtGlxkaP88abjsWYarqVohhsqLy_tLm81RLT/s320/DIVIDER.gif") no-repeat top right; } ul#menu li a:hover{ background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhL-cs6xRVp7DV_s97Oyh4Nc-87ZFJEKuy3ClW_vqzxEXAtIJ1vYf_HfLhunZkN2ffhkAktJPkXHOrAHjGiFTi7MZHZlYsC6doh3Oc1bZy5QjBh8s55kRG6-svwadftTvBPFI-XmfPCwgvd/s320/HOVER.gif") no-repeat top right; } 3.Lalu cari kode <div id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='test (Header)' type='Header'/> </b:section> </div>

4.Letakkan kode dibawah ini setelah kode no.3

<ul id='menu'> <li><a href='http://tipstricks888.blogspot.com/' title=''>Home</a></li> <li><a href='http://tipstricks888.blogspot.com/' title=''>romiFplus</a></li> <li><a href='http://tipstricks888.blogspot.com/' title=''>romiFplus</a></li> <li><a href='http://tipstricks888.blogspot.com/' title=''>romiFplus</a></li> <li><a href='http://tipstricks888.blogspot.com/' title=''>romiFplus</a></li> </ul> 

5.Selesai

Note: Ganti url dengan url anda - romiFplus ganti dengan keterangan navigasi anda