Cara membuat Dropdown Menu di Blogspot

Berikut cara untuk membuat dropdown menu di blogspot:

1. Buat struktur menu yang akan ditampilkan. misalnya :

   <div id="menuatas">
    <ul id="menuitem">
     <li>
      <a href="#">Daftar Blog</a>
      <ul>
       <li><a href="#">Abdul</a></li>
       <li><a href="#">Biyan</a></li>
      </ul>
     </li>
    </ul>
   </div>   
   
   

2. Pilih bagian setting/layout atau setelan->tata letak, tambahkan html/javascript. dan isikan dengan struktur menu yang telah dibuat.
3. Pilih bagian template, dan edit HTML, Tambahkan css berikut pada Template Blogspot, di bagian sebelum

   ]]></b:skin>

   -------------------------------------

#menuatas {
    background: #464849;
    width: 960px;
    color: #FFF;
    margin: 0px;
    padding: 0;
    position: relative;
    border-top:0px solid #960100;
    height:35px; }
#menuitem {
    margin: 0;
    padding: 0;
    }
#menuitem ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
}
#menuitem li {
    list-style: none;
    margin: 0;
    padding: 0;
    border-left:1px solid #333;
    border-right:1px solid #333;
    height:35px;
    }
#menuitem li a, #menuitem li a:link, #menuitem li a:visited {
    color: #FFF;
    display: block;
    font:normal 12px Helvetica, sans-serif;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
}
#menuitem li a:hover, #menuitem li a:active {
    background: #028490;
    color: #FFF;
    display: block;
    text-decoration: none;
    margin: 0;
    padding: 9px 12px 10px 12px;
}
#menuitem li {
    float: left;
    padding: 0; }
#menuitem li ul {
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    width: 160px;
    margin: 0;     
    padding: 0;
    }
#menuitem li ul a {
    width: 140px;
    }
#menuitem li ul ul {
    margin: -25px 0 0 161px;
}
#menuitem li:hover ul ul, #menuitem li:hover ul ul ul, #menuitem li.sfhover ul ul, #menuitem li.sfhover ul ul ul {
    left: -999em;
}
#menuitem li:hover ul, #menuitem li li:hover ul, #menuitem li li li:hover ul, #menuitem li.sfhover ul, #menuitem li li.sfhover ul, #menuitem li li li.sfhover ul {
    left: auto;
}
#menuitem li:hover, #menuitem li.sfhover {
    position: static;
}
#menuitem li li a, #menuitem li li a:link, #menuitem li li a:visited {
    background: #028490;
    width: 120px;
    color: #FFF;
    display: block;
    font:normal 12px Helvetica, sans-serif;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    z-index:9999;
    border-bottom:1px dotted #333;
    }
#menuitem li li a:hover, #menuitemli li a:active {
    background: #70b6bd;
    color: #FFF;
    display: block;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
} 

Selamat mencoba!