Add Here

Cara Membuat Menu Horizontal

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