Hal pertama yang harus dilakukan adalah login ke blogger > Layout/Tata Letak > Edit Html .
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>
Anda ubah kode
showaddelement='no' menjadi showaddelement='yes' , kalau sudah klik simpan ya
Setelah yang pertama sudah disimpan, sekarang klik
Page elements / Elemen Laman >
Tambah Gadget >
HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header.
<a href="http://www.dinka28.blogspot.com " class="navigation">HOME</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">CONTACT</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">BUKUTAMU</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">TUTORIAL</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">SOFTWARE</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">DOWNLOAD</a>
<a href="http://www.dinka28.blogspot.com " class="navigation">LAIN-LAIN</a>
*Alamat url diatas silahkan sesuaikan dengan blog Anda.
Hal ketiga adalah supaya menu itu menimbulkan efek warna sehingga menjadi kelihatan menarik.
Klik
Tata Letak >
Edit HTML , cari kode
</b:skin> , agar mudah gunakan tombol CTRL+F
Copy kode dibawah ini dan letakan tepat diatas kode </b:skin> kemudian simpan.
a.navigation {
background: #3333ff ;
color: #ffffff;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation:hover {
background: #333333;
color: #ffffff;
text-decoration: none;
}
Perhatikan kode yang berwarna
biru adalah warna tombol dan efek hover dan bisa dirubah sesuka hati Anda.Dan yang berwarna
merah adalah jarak antara tombol satu dengan lainnya, silahkan Anda sesuaikan sesuai selera.
Untuk mengetahui kode-kode warna dalam HTML silahkan lihat juga
disini.
Selesai, semoga bermanfaat....
salam...
Ditulis Oleh : Unknown ~ Tips dan Trik Blogspot
Sobat sedang membaca artikel tentang CARA MEMBUAT MENUBAR DI BLOGSPOT. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
0 komentar:
Posting Komentar