Senin, 21 Februari 2011

Cara Lain Membua Menu Navigasi Horizontal

Menu navigasi Horizontal, merupakan barisan menu-menu yang terdapat pada blog yang tersusun secara horizontal/mendatar. Sebelumnya saya sudah memberikan artikel mengenau MENU NAVIGASI.Jika sobat merasa tips ini kurang baik, silahkan kunjungi artikel saya tersebeut.
Langsung saja ke langkah-langkahnya yah!

1. Login ke blogger dengan Akun anda
2. Pilih Rancangan
3. Kemudian Pilih Edit HTML
4. Cari kode ini ]]></b:skin>
5. Letakkan kode script berikut tepat diatas kode ]]></b:skin>

#navigation {
list-style: none;
background: #b60002;
overflow: hidden;
width: 922px;
}
#navigation li {
float: left;
border-right: solid 1px #ca0002;
height: 35px;
}
#navigation li a:link, #navigation li a:visited {
text-decoration: none;
display: block;
height: 35px;
color: #fff;
line-height: 35px;
padding: 0 9px 0 9px;
border-right: solid 1px #990000;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}
#navigation li a:hover {
background: #990000;
color: #fff;
list-style: none;
}
#navigation li.first {
border-left: solid 1px #ca0002;
}
Silahkan anda edit sendiri Menu Navigasi Anda.
6. Kemudian silahkan Simpan Template anda
7. Kemudian anda beralih ke pada Elemen Laman
8. Pilih Tambah Gadget
9. Kemudian Pilih HTML/JavaScript
10. Letakkan kode script ini
<ul id="navigation">
<li class="first"><a href="#">Home</a></li>
<li><a href="#">Video</a></li>
<li><a href="#">NewsPulse</a></li>
<li><a href="#">U.S.</a></li>
<li><a href="#">World</a></li>
<li><a href="#">Politics</a></li>
<li><a href="#">Justice</a></li>
<li><a href="#">Entertainment</a></li>
<li><a href="#">Tech</a></li>
<li><a href="#">Health</a></li>
<li><a href="#">Living</a></li>
<li><a href="#">Travel</a></li>
<li><a href="#">Opinion</a></li>
<li><a href="#">iReport</a></li>
<li><a href="#">Money</a></li>
<li><a href="#">Sports</a></li>
</ul>
Silahkan anda, edit sendiri. Jika anda tidak mengerti silahkan tinggalkan pertanyaan anda di kotak komentar.
Terima kasih.
Biasanya, gadgetnya itu ditempatkan di bawah sidebar blog. Jika blog anda tidak mempunyai sidebar tunggu artikel dari saya selanjutnya.
11. Kemudian Save

Selamat Mencoba

Tidak ada komentar:

Posting Komentar