Menu Horizontal adalah Menu (Link) yang berbaris dibawah atau diatas header blog, gunanya untuk membuat menu utama blog berupa tulisan seperti : Home, Tutorial, Downloads dan lain-lain seperti gambar dibawah ini :
Nah, dalam artikel ini, HM akan membahas tentang Cara Membuat Menu Horizontal seperti gambar diatas, bagaimana caranya? Berikut langkah-langkahnya :
1. Login ke Blogger
2. Pilih Template, lalu klik Edit HTML
3. Lalu cari kode ]]></b:skin>, lalu masukan kode berikut diatas kode ]]></b:skin>
#under_header{
margin:10px 0;
padding:1%;
width:98%;
}
4. Kemudian cari kode seperti dibawah ini
<div
id='header-wrapper'>
<b:section class='header' id='header' maxwidget="1"
showaddelement="no">
<b:widget id='Header1' locked='true' title='test (Header)'
type='Header'/>
</b:section>
</div>
5. Masukan kode berikut dibawah kode tadi
<div
id="under_header">
<b:section class='header' id='underheader' preferred='yes'/>
</div>
6. Klik Simpan.
7. Selanjutnya, pilih Tata Letak
8. Lalu klik Tambahkan Gadget
9. Berikutnya klik Tambahkan HTML/JavaScript
10. Masukan kode berikut di kolom HTML/JavaScript
<div
id="menu">
|<a href="Link" title="back to
home">Home</a>|
<a href="Link" onclick="return
clickreturnvalue()" onmouseover="dropdownmenu(this, event, menu1,
'200px')" onmouseout="delayhidemenu()" title="apa aja boleh">Tutorial</a|
<a href="Link" onclick="return
clickreturnvalue()" onmouseover="dropdownmenu(this, event, menu2,
'200px')" onmouseout="apa aja boleh">Downloads</a>|
<a href="Link" onclick="return
clickreturnvalue()" onmouseover="dropdownmenu(this, event, menu3,
'200px')" onmouseout="apa aja boleh" title="apa
ajah">Pasang Iklan</a>|
<a href="Link" onclick="return
clickreturnvalue()" onmouseover="dropdownmenu(this, event, menu4,
'200px')" onmouseout="apa aja boleh" title="cocok bagi anda
yang ingin belajar lebih jauh tentang pembuatan website">Kesehatan</a>|
</div>
11. Ubah "Link" yang berwarna merah dengan link-link blog anda, ubah teks yang berwarna biru dengan teks yang anda inginkan
12. Klik Simpan, lihat hasilnya.
Demikian artikel HM tentang Cara Membuat Menu Horizontal, semoga bisa membantu dan bermanfaat. Terimakasih...
0 comments:
Post a Comment