Cara Membuat Sub Menu Di Blog

Salam Bloggers , saya akan berbagi ilmu kepada kalian Cara Membuat Sub Menu Di Blog dengan menggunakan HTML/JavaScript , dan ini sangat mudah tentunya . jika menggunakan kode CSS / HTML di Edit Html itu sebenarnya agak susah , jika agan memakai cara ini tentunya akan simple karna tidak memengaruhi kode CSS . Bentuk sub menu nya bisa dilihat diblog saya , juga bisa dilihat dari gambar diatas , walaupun tidak dapat merubah warna BACKGROUND , tetap akan menarik kok gan :D, agan tertarik ? , ikuti langkah langkah yang saya buat dibawah ini :


- Pertama tama , agan harus login ke Blogger


- Setelah agan ke blogger , pilih blog yang ingin ditempelkan sub menu ini


- Yang ketiga , pilih menu tata letak , atau bisa lihat gambar dibawah ini





- Lalu pilih Tambahkan Gadget/ widget dibawah header . ( NB : Bagi yang sudah menggunakan Gadget dibawah header , tidak berlaku untuk tutorial ini )




- Pilih Menu HTML/JavaScript



- Tambahkan Kode Berikut :

<div id="RickyMenu">
       <div id="Rickybox">
      <ul id="punch">
        <li><a href="#">Beranda</a></li>
        <li>
          <a href="#">Contoh Menu</a>
          <ul>
            <li>
              <a href="#">Contoh Menu Dropdown #1</a>
              <ul>
                <li><a href="#">Dropdown #1</a></li>
                <li><a href="#">Dropdown #2</a></li>
                <li><a href="#">Dropdown #3</a></li>
              </ul>
            </li>
            <li><a href="#">Dropdown #2</a></li>
            <li><a href="#">Dropdown #3</a></li>
            <li><a href="#">Dropdown #4</a></li>
          </ul>
        </li>
        <li><a href="#">Daftar Isi</a></li>
        <li><a href="#">Blog Page</a></li>
      </ul>
    </div>
  </div>

Keterangan : Teks Biru : URL yang ingin dituju
                     Teks Merah : Nama Menu

Untuk yang tidak ada Dropdown

.<div id="RickyMenu">
       <div id="Rickybox">
      <ul id="punch">
        <li><a href="URL ANDA">Beranda</a></li>
        <li>
          <a href="URL ANDA">Daftar Isi</a><li>
            <li>
        <li><a href="URL ANDA">Menu</a></li>
        <li><a href="URL ANDA">Contact</a></li>
      </li></li></li></ul>
    </div>
  </div>

Keterangan : Teks Biru : URL yang ingin dituju
                     Teks Merah : Nama Menu

Sekian tutorial dari saya , jika ingin cara menambahkan menu / berkaitan dengan artikel ini tolong komentar dibawah , dan jgn lupa ikuti blog ini