Cara Membuat Menu Horizontal di Blogspot - Bagi anda yang baru pertama belajar ngeblog saya akan berbagi tips dengan anda kali ini mengenai cara membuat menu horizontal di blog,, baru kemaren saya udah coba menu ini,, dan anda bisa liat di blog saya,, ya walaupun masih kacau alias amburadul,, hehehe,, maklum baru belajar,, hohoho..oke langsung aja bagi yang pengen tahu caranya langsung aja liat dibawah ini tips membuat menu horizontal :
Cara Membuat Menu Horizontal di Blogspot
Langkah pertama : Login ke bloger.com lalu pilih pengaturan template
Langkah kedua : Pilih edit HTML, simpan template anda sebelumnya, untuk berjaga-jaga klo anda ingin kembali ke tampilan template yang lama.
Langkah ketiga : Centang kotak expand template anda agar kode HTML muncul semua.
Langkah keempat : Cari kode :
</b:skin>
ganti kode tersebut dengan kode :
</b:skin><style type='text/css'>.pagemenu-container
#pagemenu{position:relative;display:block;height:42px;font-size:14px;font-weight:bold;background:#000
repeat-x top
left;font-family:Arial,Verdana,Helvitica,sans-serif;text-transform:uppercase}.pagemenu-container
#pagemenu ul{margin:0;5px;0px;5px;padding:0;border:1px solid $bordercolor;list-style-type:none;width:860px}.pagemenu-container
#pagemenu ul li{display:block;float:left;margin:0 1px 0
0}.pagemenu-container #pagemenu ul li
a{display:block;float:left;color:#fbdafa;text-decoration:none;padding:10px 18px 0 18px;height:28px}.pageme nu-container #pagemenu ul li a:hover,.pagemenu-container #pagemenu ul li a.current{color:#fff;background:#306 no-repeat top center}</style>
Langkah kelima : setelah anda berhasil kode diatas anda cari lagi kode :
<div id='content-wrapper'>
Seperti halnya diatas ganti kode tersebut dengan kode :
<div class='pagemenu-container'> <div id='pagemenu'> <ul> <li class='page_item home'><a href='http://www.cariinfo-nesya.blogspot.com/' title='Home'>Home</a></li> <li class='page_item page-item-2'><a href='http://cariinfo-nesya.blogspot.com/l' title='About'>About</a></li> <li class='page_item page-item-3'><a href='http://www.blogger.com/profile/' title='Contact Us'>Contact</a></li><li class='page_item page-item-4'><a href='http://cariinfo-nesya.blogspot.com/search/label/Download' title='SOFTWARE'>SOFTWARE</a></li><li class='page_item page-item-5'><a href='http://www.cariinfo-nesya.blogspot.com/search/label/Informasi' title='INFORMASI'>INFORMASI</a></li></ul></div> </div> <div id='content-wrapper'>
Untuk huruf cetak dengan warna biru,ubahlah sesuai dengan selera anda,, sekian dan terimakasih untuk para pembaca sekalian,, akhir kata selamat mencoba..
Sekian informasi tentang Cara Membuat Menu Horizontal di Blogspot
Sekian informasi tentang Cara Membuat Menu Horizontal di Blogspot
