Cara membuat drop down menu diblogspot

Cara membuat drop down menu, drop down menu sangatlah penting karena untuk menampilkan sub-sub menu atau anak-anak dari menu yang kita punya.

Langsung aja kita ke LANGKAH-LANGKAH PEMBUATAN DROP DOWN MENU

1. Langkah pertama Masuk ke akun blogger Anda
2. Lalu masuk menu Rancangan
3. Kemudian masuk menu Edit HTML
4. Kemudian cari kode ]]></b:skin> caranya tekan CTRL+F
5. Copy pastekan kode yang berwarna merah dibawah ini dan letakkan diatas kode yang tadi Anda cari

/* ######### Script Floating Buka  ######### */


#sticky1 { position:fixed;_position:absolute;top:0px; left:0px;
clip:inherit; _top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

/*  Script weight :12px; by Rizgun Blog height :10px;  */

/* ######### Script Floating Tutup  ######### */




    .jqueryslidemenu{
    font: bold 13px Verdana;
    background: #800000;
    width:100%;
    float:left
    }


    .jqueryslidemenu ul{
    margin: 0;
    padding: 0;
    list-style-type: none;
    }


    /*Top level list items*/
    .jqueryslidemenu ul li{
    position: relative;
    display: inline;
    float: left;
    }


    /*Top level menu link items style*/
    .jqueryslidemenu ul li a{
    display: block;
    background: #800000; /*background of tabs (default state)*/
    color: white;
    padding: 8px 10px;
    border-right: 1px solid #778;
    text-decoration: none;
    }


    * html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
    display: inline-block;
    }


    .jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
    color: white;
    }


    .jqueryslidemenu ul li a:hover{
    background:#B30000; /*tab link background during hover state*/
    color: white;
    }


    /*1st sub level menu*/
    .jqueryslidemenu ul li ul{
    position: absolute;
    left: 0;
    display: block;
    visibility: hidden;
    background:#B30000;
    }


    /*Sub level menu list items (undo style from Top level List Items)*/
    .jqueryslidemenu ul li ul li{
    display: list-item;
    float: none;
    }


    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
    .jqueryslidemenu ul li ul li ul{
    top: 0;
    }


    /* Sub level menu links style */
    .jqueryslidemenu ul li ul li a{
    font: normal 13px Verdana;
    width: 160px; /*width of sub menus*/
    padding: 5px;
    margin: 0;
    border-top-width: 0;
    border-bottom: 1px solid gray;
    }


    .jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
    background: #eff9ff;
    color: black;
    }


    /* ######### CSS classes applied to down and right arrow images ######### */


    .downarrowclass{
    position: absolute;
    top: 12px;
    right: 7px;
    }


    .rightarrowclass{
    position: absolute;
    top: 6px;
    right: 5px;
    }
    #footheader {
    width: 100%;
    float:left;
    margin:0 0 0;
    padding:0 0 0;
    position:relative;
    }

      6.  Simpan template !
      7.  kemudian masuk menu elemen laman
      8.  Lalu tambah gadget dan pilih HTML/Java script
      9.  Kemudian masukkan kode dibawah ini

<div id="myslidemenu" class="jqueryslidemenu">
<ul>
<li><a href="/">Home</a></li>
<li><a href="http://rizkyguna1.blogspot.com">SangMerak</a></li>
<li><a href="#">Kategori</a>
<ul>
<li><a href="#">Sub Kategori 1</a></li>
<li><a href="#">Sub Kategori 2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://rizkyguna1.blogspot.com">Tutorial Blog</a></li>
</ul>
<br style="clear: left" />
</div>

Simpan dan lihat hasilnya
*Catatan
Edit dan tambahkan link-link nya