Cara membuat menubar dropdown

1.) Baca Basmallah
2.) Masuk ke akun blogger sobat
3.) Masuk ke Dashboard > Template > Edit Html > Lanjutkan
4.) Centang tanda Expand Template Widget
5.) Lalu cari kode ]]></b:skin>
6.) Jika sudah ketemu, masukkan kode dibawah ini tepat diatas kode ]]></b:skin>
Kode
    menu{
    border:none;
    border:0px;
    margin:0px;
    padding:0px;
    font: 67.5% "Arial", Arial;
    font-size:14px;
    font-weight:bold;
    }
    .menu ul{
    background:#333333;
    height:35px;
    list-style:none;
    margin:0;
    padding:0;
    font-size:14px;
    font-weight:bold;
    }
    .menu li{
    float:left;
    padding:0px;
    }
    .menu li a{
    background:#333333 url("http://i47.tinypic.com/qp53sw.jpg") bottom right no-repeat;
    color:#cccccc;
    display:block;
    font-weight:normal;
    line-height:35px;
    margin:0px;
    padding:0px 25px;
    text-align:center;
    text-decoration:none;
    }
    .menu li a:hover, .menu ul li:hover a{
    background: #2580a2 url("http://i49.tinypic.com/13zbc53.jpg") bottom center no-repeat;
    color:#FFFFFF;
    text-decoration:none;
    }
    .menu li ul{
    background:#333333;
    display:none;
    height:auto;
    padding:0px;
    margin:0px;
    border:0px;
    position:absolute;
    width:225px;
    z-index:200;
    /*top:1em;
    /*left:0;*/
    }
    .menu li:hover ul{
    display:block;
    }
    .menu li li {
    background:url('http://i45.tinypic.com/nvxxqg.jpg') bottom left no-repeat;
    display:block;
    float:none;
    margin:0px;
    padding:0px;
    width:225px;
    }
    .menu li:hover li a{
    background:none;
    }
    .menu li ul a{
    display:block;
    height:35px;
    font-size:12px;
    font-style:normal;
    margin:0px;
    padding:0px 10px 0px 15px;
    text-align:left;
    }
    .menu li ul a:hover, .menu li ul li:hover a{
    background:#2580a2 url('http://i50.tinypic.com/66elwh.jpg') center left no-repeat;
    border:0px;
    color:#ffffff;
    text-decoration:none;
    }
    .menu p{
    clear:left;
    }

7.) Simpan Template
8.) Buka Tata Letak > Tambah Gadget > Html/Javascript
9.) Masukkan kode berikut di form Konten yang tersedia

contoh blogavel :

[Menu bar SIngel ;]
<div class="menu"><ul><li><a href="http://blogavel.blogspot.com/"> Beranda </a></li>

[menu bar sub menu ;]
<li><a href="http://blogavel.blogspot.com/search/label/travel%20in%20pasuruan">Travel Range Pasuruan</a><ul>
<li><a href="#">Alam</a></li>
<li><a href="#">wisata </a></li></ul></li>

[menu bar sub menu ;]
<li><a href="#">Biografi</a><ul>
<li><a href="#">Tokoh</a></li>
<li><a href="#">artis</a></li></ul></li>

[Menu bar SIngel ;]
<li><a href="#/"> article </a></li>
<li><a href="#/"> Komputer </a></li>
<li><a href="#/"> Gallery </a></li>
<li><a href="#/"> Cerita </a></li>
<li><a href="#/"> tricks  and tips </a></li>
<li><a href="#/"> RSS </a></li>
<li><a href="#">Contact me</a></li></ul></div>

untuk tanda # ganti dengan tautan blogger kamu yang kamu butuhkan baca
Baca : Tricks and tips Membuat menubar Dropdown