Cara membuat dropdown di blog yang bagus dan benar

1. Masuk dasbhor

2. Klik template

3. Edit template

4. Cari kode </b:skin> . biar mudah tekan Ctrl+f kemudian masukan </b:skin> enter . setelah ketemu     klik simbol(...) di tengah tulisan </b:skin> kemudian copykan script ini di atas kode </b:skin> .

nav{text-transform:uppercase;position:relative;font:bold12px Arial,Sans-Serif;background:#e74c3c} nav *{margin:0 0 0 0;padding:0 0 00;list-style:none} navul{overflow:hidden;background:rgba(231,76,60,0.84);float:left} navli{float:left;display:inline} nav li a{padding:3px15px;line-height:40px;color:#fff!important;display:block;text-decoration:none}nav li a:hover{background:rgba(231,76,60,0.84)!important} nav liul{display:block;width:170px;position:absolute;left:auto;z-index:10;visibility:hidden;opacity:0;height:auto;transition:all0.26s ease-out 0.2s} nav li li{display:block;float:none;width:100%} navli:hover > ul{visibility:visible;width:200px;opacity:1} nav li liul{left:200px;margin-top:-40px} nav li.sub >a{position:relative;padding-right:30px} nav li.sub >a:after{content:"";width:0;height:0;border-width:4px;border-style:solid;border-color:#eeetransparent transparent transparent;position:absolute;top:20px;right:10px} navli.sub li.sub > a:after{content:"";width:0;height:0;border-width:4px;border-style:solid;border-color:transparenttransparent transparent #eee;position:absolute;top:16px;right:10px}

5. Supaya tampilan menu bisa responsive , yang kita harus lakukan adalah mengcopykan script di bawah ini di copy di atas kode </b:skin>

@media screen and (max-width:600px){#nav2{display:inherit;margin:5px;float:left;padding:8px}nav ul{display:none}}@media screen and (max-width:380px){#nav2{padding:3px}#search-top{padding:5px}input[type="text"]{padding:5px;width:90px}#search-button-top{background-image:url("http://3.bp.blogspot.com/-60fYApN0j2M/Ub8uXOv4rNI/AAAAAAAACBs/6PDa4uu3cHk/s1600/csg-51bf2d6764c79.png");background-repeat:no-repeat;transition:all 0.7s ease 0s;height:26px;width:29px;background-color:#34495e;background-position:7px -247px;border:none;float:right;cursor:pointer}}}

6. Kemudian letakkan script ini suka-suka anda .tapi kalo saya di bawah <header>

<nav><ul><li><a href="/search/label/Tutorial">Tutorial</a></li><li class="sub"><a href="/search/label/Template">Template</a><ul><li><a href="/search/label/CSS3">CSS3</a></li><li><a href="/search/label/HTML5">HTML5</a></li><li><a href="/search/label/Responsive">Responsive</a></li><li><a href="/search/label/SEO">SEO</a></li></ul></li></ul><select class="nav2" id="nav2" onchange="document.location.href=this.options[this.selectedIndex].value;"><option value="/">Home</option><option value="/search/label/Tutorial">Tutorial</option><option value="/search/label/Template">Template</option><option value="/search/label/CSS3">- CSS3</option><option value="/search/label/HTML5">- HTML5</option><option value="/search/label/Responsive">- Responsive</option><option value="/search/label/SEO">- SEO</option></select><form action="/search" id="search-top" method="get"><input name="q" placeholder="Search..." type="text"/><input id="search-button-top" type="submit" value=""/></form></nav>

Kemudian simpan lalu reload blog anda dan coba hasilnya