BLOG RANGGA

Cara Membuat Menu Horizontal Mengambang Di Blog , ya .....itu lah postingan saya kali ini , oh ya sob judul nya mungkin tidak sesuai karena saya juga tidak tahu nama menu ini , Menu yang satu ini posisi nya tetap/ relatif seperti navbar bawaan pada blog .

kalau sobat pingin tahu tampilanya seperti apa , silahkan aja coba pasang langsung selagi masih gratis he...he...., Cara pasang nya yaitu :

1. Login ke Blogger.
2. Klik Tata Letak.
3. Pilih Tambah Gadged.
4. Pilih HTML/Javascript.
5. Copy kode di bawah ini ke Halaman HTML/Javascript.

<style media='screen' type='text/css'>
/*----- TOP -----*/
#top {background:#eee; color:#666; font-size:11px; line-height:30px; border-bottom:1px solid #ECEDE8;
opacity:.85;
filter:alpha(opacity=85);
-moz-opacity:.85;
position: fixed;
align: center;
top:0;left:0;
width:100%;
}
#top li a:hover{ background-color:#333; color:#fff; }
/*----- TOP NAV -----*/
.topnav ul li{ margin:0;}
.topnav li { float:left; width:auto; }
.topnav li a { padding:6px 11px; font-size:11px; line-height:16px; border-right:1px solid #ddd; text-decoration:none; }
/* search form */
#search { display:inline; float:right; height:14px; margin:3px 15px 0px 0px; }
#search input { float:left; background:#fff; width:160px; padding:2px 5px 3px 5px; font-family:Arial,serif; font-size:12px; font-style:italic; color:#999; line-height:12px; border:1px solid #ECEDE8; }
#search input:focus { background:#fff; border:1px solid #ddd; }
#search input.btn { background:none; border:none; margin:4px 0px 0px -23px; padding:0px; width:auto; }
</style>
<div id='top'>
<div id='search'>
<form action='/search' id='searchform' method='get'>
<input class='field' id='s' name='q' type='text' value=''/>
<input class='submit btn' src='http://3.bp.blogspot.com/-AQ0v1sE-miA/TcANHnMOmBI/AAAAAAAAAXA/QVOV_CeHk4Q/s1600/iconsearchr.gif' type='image' value='Go'/>
</form>
</div><!--end #search -->
<div class='topnav'>  
<ul class='topnav' id='page-nav'>
<li><a href='/'>Home</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
<li><a href='Link URL'>Judul</a></li>
</ul>              
</div>
<div class='clear'/>
</div>

Keterangan :
 Link Url diganti dengan link url blog sobat yang mau dipasang
 Judul diganti dengan judul link Url yang sobat yang di pasang tadi

6. Simpan untuk melihat hasil nya di blog .

Kalau sobat ingin membuat menu horizontal lain nya klik aja di sini cara mudah membuat menu horizontal blog

sekian dan terima kasih ..............

---

---