Cara Membuat Menu Bertingkat ( sub Menu ) pada Menu Header Blog

1. Masuk ke akun blogger anda

2. Pada Menu Template klik Edit HTML

( Lihat Juga Tutorial Blogger Lainnya di Daftar Isi Sinauyuk.com )

3. Cari kode brikut ]]></b:skin> ( klik di dalam kotak edit html pencet ctrl+f )
4. Copy kode berikut, paste tepas diatas ]]></b:skin>

.tabs-inner .widget li ul {
  z-index: 100; position: absolute;
  left: -999em; height: auto; margin: 0; padding: 0;
  border: 1px solid #999999;
}

.tabs-inner .widget li ul, .tabs-inner .widget li ul a,
.tabs-inner .widget li ul li:first-child a {
  -moz-border-radius: 0px; -webkit-border-radius: 0px;
  -goog-ms-border-radius: 0px; border-radius: 0px;
}

.tabs-inner .widget li:hover ul, .tabs-inner .widget li.sfhover ul {
  left: auto;
}

.tabs-inner .widget li li a:hover, .tabs-inner .widget li li a:active {
  color: #ffffff; background: rgb(51, 102, 153);
}

.tabs-inner .widget li ul a {
  display: block; padding-left: 1.25em; padding-right: 1.25em;
  margin-left: 0px; margin-right: 0px; border: none;
  color: #000000; background: rgb(243, 244, 246);
}

.tabs-inner .widget li ul, .tabs-inner .widget li ul a {
  width: 250px;
}

Keterangan :

• Kode berwarna Kuningmerupakan ukuran garis pembatas / bingkai sub menu ada bisa merubahnya menjadi lebih tebal dengan mengganti angka 1 menjadi 2,3,4,atau lebih dari itu atau menghilangkannya dengan mengubah angka 1 menjadi 0
• Kode berwarna hijauadalah warna background dari sub menu anda bisa merubahnya dengan mengganti kode warnanya. untuk dapat mengetahui kode warna sebuah warna bisa dilihat disini
• Kde berwarna orangeadalah kode untuk merubah warna teks di dalam sub menu sama seperti warna background anda juga dapat merubahnya
• kode berwarna birumerupakan lebar dari sub menu ada bisa merubahnya menjadi lebih lebar atau lebih sempit

( Baca Juga   :   Cara Membuat Read More / Baca Selanjutnya pada Postingan Blog )

5. Cari kode <li><a expr:href='data:link.href'><data:link.title/></a></li> ,Lihat beberapa baris kode dibawahnya akan terdapat kode <b:/loop> . Salin kode berikut tepat dibawah <b:/loop>

<li><a href='#'>Menu1</a>   <ul>     <li><a href='http://sinauyuk.com/'>Sub Menu 1</a></li>     <li><a href='http://sinauyuk.com'>Sub Menu 2</a></li>     <li><a href='http://sinauyuk.com'>Sub Menu 3</a></li>   </ul> </li>

Keterangan :

• Kode berwarna merahadalah tulisan pada menu utama
• kode berwarna kuningadalah URL dari sub menu
• Kode berwarna hijauadalah nama dari sub menu
  
  Jika anda ingin lebih dari 3 submenu silahkan tambahkan kode
  
  <li><a href='http://sinauyuk.com/'>Sub Menu 1</a></li> sebanyak yang anda butuhkan

( Baca Juga   :   Cara Mengganti Jenis Font ( Huruf ) pada Halaman Blog )

6. Simpan Template

Menu bertingkat pada blog sudah jidi. Jika ada yang kurang jelas atau ada yang ingin ditanyakan silahkan tulis di kolom komentar.Selamat Mencoba dan terus belajar.