Cara buat menu bar blogspot tanpa edit html

ikhsanudin on

Thursday, February 14, 2013

- Login ke blogger
- Lay Out (lihat gambar)

- Add Gadget
- HTML/JavaScript
- Masukkan kode berikut pada HTML/JavaScript

<style> #exenav-left{float:left; display:inline; width:100%; padding-left:2px; padding-top:5px} #exenav{clear:both; margin:0 auto} #exenav ul{position:relative; overflow:hidden; padding:0; margin:0; font-family:Arial,Helvetica,sans-serif; font-weight:bold; font-size:12px} #exenav li{cursor:pointer; float:left; margin:0 1px 0 0; padding:0 1px 0 0; height:40px; display:inline;} #exenav ul li a, #exenav ul li a:visited{text-decoration:none;border:0px solid #000000; margin:0 1px 0 0; float:left; padding:8px 9px; color:#fff; font-weight:bold; font-size:12px;margin-top:-2px; background:#0000FF; border-radius:4px 4px; -moz-border-radius:4px 4px 0 0; -khtml-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0; border-radius:4px 4px 0 0} #exenav ul li a:hover{border:2px solid #111; background:#FF0000 top left repeat-x; border-radius:8px 8px; -moz-border-radius:8px 8px 8px 8px; -khtml-border-radius:8px 8px 8px 8px; -webkit-border-radius:8px 8px 8px 8px; border-radius:8px 8px 8px 8px} #exenav ul li a.current, #exenav ul li a.current:visited, <!--ikhsanu.blogspot.com --> a:hover {text-decoration:none;} a img {border-width:0;} #hb{height:40px;margin-bottom:10px; margin-top:50px; background:#0000FF; border-radius:8px 8px; -moz-border-radius:8px 8px 8px 8px; -khtml-border-radius:8px 8px 8px 8px; -webkit-border-radius:8px 8px 8px 8px; border-radius:8px 8px 8px 8px} #exenav-element{width:100%; margin-top:-24px; padding:0} </style><br /> <div id='hb'> <div id='exenav-element'> <div id='exenav-left'> <div id='exenav'> <ul> <li><a href='http://ikhsanu.blogspot.com'>HOME</a></li> <li><a href='http://ikhsanu.blogspot.com'>Tutorial</a></li> <li><a href='http://ikhsanu.blogspot.com'>Blogger</a></li> <li><a href='http://ikhsanu.blogspot.com'>Wordpress</a></li> <li><a href='http://ikhsanu.blogspot.com '>Facebook</a></li> <li><a href='http://ikhsanu.blogspot.com'>Twitter</a></li> </ul> </div> </div> </div> </div>

- Ganti url http://ikhsanu.blogspot.com dengan link yang kita inginkan
- Save / Simpan
- Tarik / Pindahkan Gadget yang telah di simpan ke atas posting / dibawah header

Labels: Blogger

Thanks for reading Cara buat menu bar blogspot tanpa edit html. Please share...!