Cara memasang menu drop down di atas header. Selamat sero bray gimana kabarnya baik kan amin deh kalau baik-baik saja ohya bray saya ada artikel baru nih tentang cara memasang menu drop down di atas header yaudah langsung saja di simak.
1. masuk ke blog kalian masing-masing kalau belum masuk klik disini
2. pilih template kemudian edit html
3. masuk kan kode diwabah ini tepat sebelum/ di atas kode ]]></b:skin>
/* Menu Horizontal Dropdown ----------------------------------------------- */ #menuwrapperpic{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXYk6DiF2ViLAkBMSFmsu0OKr5A6GGeUgvDg_U-eeCHsriOqthEHm7I1dT77w1maR80IWFES3qsN_KUL06IzrQumFniS7lAzZe5JA_PbBiuKhStOKBysju3EyGqV36fL9TGWVqccQZuZ4/s1600/menubar.png) repeat-x;width:960px;margin:0 auto;padding:0 auto} #menuwrapper{width:960px;height:35px;margin:0 auto} .menusearch{width:300px;float:right;margin:0 auto;padding:0 auto} .clearit{clear:both;height:0;line-height:0.0;font-size:0} #menubar{width:100%} #menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0} #menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;color:#CECECF;border-right:1px solid #191919;padding:12px 10px 8px} #menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFxHjvNDX1WV4mdCUur0A3x1avvAF2gdA6PQbhrh8MjQnVqEjFHnfxzN9-UruMowIlVahYtvBFZnpj2lbyjeCdz20drQaJYdz3t3olgjMu4_TZLdmg7EGY-lBGBfNK8OgjZn9eKOKaP_o/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:12px 24px 8px 10px} #menubar li{float:left;position:static;width:auto} #menubar li ul,#menubar ul li{width:170px} #menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px} #menubar li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)} #menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#222;color:#E98C0A} #menubar li:hover ul,#menubar li.hvr ul{display:block} #menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none} #menubar li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0} #menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}
4. setelah itu masukan kode di bawah ini tepat di atas kode <header>
<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='http://abrihandany.blogspot.com/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgV9LBHvu8sdQS7vTtPd-fjQ5y-fDnAdKcEtzmisewUCI-n8kQZ0dqbBtRcg78v48zRbNcmNmk3uahsdF4OqlfO8oWdwo1euCB-vucg3Boe0CV5QYfhxLx62MfqQh1JpcKhjb4JCsP_Otw/s1600/home_white.png' style='padding:0px;'/>Home</a></li>
<li><a href='http://abrihandany.blogspot.com/2013/06/biodata-tentang-saya.html?max-results=10'>About Me</a></li>
<li><a class='trigger'>Kumpulan Cerita</a>
<ul>
<li><a href='http://abrihandany.blogspot.com/search/label/Cerita%20Bacaan?max-results=10'>Cerita Bacaan</a></li>
<li class='hr'/>
<li><a href='http://abrihandany.blogspot.com/search/label/Cerita%20Dewasa?max-results=10'>Cerita Dewasa</a></li>
<li class='hr'/>
<li><a href='http://abrihandany.blogspot.com/search/label/Cerita%20Seram?max-results=10'>Cerita Seram</a></li>
<li class='hr'/>
</ul>
</li>
<li><a class='trigger'>Komik Bahasa Indo</a>
<ul>
<li><a href='http://abrihandany.blogspot.com/2013/07/komik-shingeki-no-kyojin-bahasa.html'>Shingeki No Kyojin</a></li>
<li class='hr'/>
<li><a href='#/'>Bleach</a></li>
<li class='hr'/>
<li><a href='http://abrihandany.blogspot.com/2013/06/komik-khusus-dewasa.html'>Komik Khusus Dewasa</a></li>
<li class='hr'/>
</ul>
</li>
<li><a class='trigger'>Sejarah Anime-anime</a>
<ul>
<li><a href='http://abrihandany.blogspot.com/2013/07/komik-shingeki-no-kyojin-bahasa.html'>Shingeki No Kyojin</a></li>
<li class='hr'/>
<li><a href='http://abrihandany.blogspot.com/2013/07/sejarah-bleach.html'>Bleach</a></li>
<li class='hr'/>
<li><a href='http://abrihandany.blogspot.com/2013/06/sejarah-one-piece.html'>One Piece</a></li>
<li class='hr'/>
</ul>
</li>
5. Kemudian save/simpan
NB: Kode warna kuning adalah alamat blog anda dan alamat label blog anda jadi ganti dengan punya anda
: Kode warna hijau adalah judul menu drop down jadi ganti sesuai punya anda
dan hasilnya akan sama seperti punya saya dan bila ada kekurangan anda bisa menambahkanya dengan cara mengedit kodenya, dan seandainya anda kurang mengerti anda bisa menanyakannya ke saya dengan cara berkomentar di kotak komentar,. secepatnya saya akan merespon komentar anda.
Home »
Tutorial Blog
» Cara memasang menu drop down di atas header
Cara memasang menu drop down di atas header

Ditulis Oleh : Unknown

Label:
Tutorial Blog
0 komentar:
Posting Komentar
Terima Kasih Atas Kunjungannya dan Kesediaannya untuk Berkomentar pada Blog ini. Saya Sangat menghargai Setiap Komentar, Masukkan, Saran, dan Kritik yang sekiranya dapat Membangun Blog ini Agar Lebih Baik Lagi Kedepannya.
Saya akan berusaha untuk cepat menanggapi komentar anda
Terima Kasih atas Kunjungannya Sobat,,...
SALAM SUKSES