Cara Membuat Kotak Banner Di Bawah Header Blog

keyword: Cara Membuat Kotak Banner Di Bawah Header Blog

Oke, kali ini SOULDARKNESS akan SHARE "Cara Membuat Kotak Banner Di Bawah Header Blog", kotak banner ini biasa digunakan untuk menrauh banner setelah tukar banner, kotak bannernya juga sangat rapih sekali. Bagaimana cara membuatnya? oleh sebab itu SOULDARKNESS akan membahasnya.

• Masuk ke dashboard blogger kalian
• Pilih blog yang akan kalian gunakan, masuk ke menu Template
• Cari kode ]]></b:skin>, letekan kode berikut tepat diatasnya

#WAKBannerS {width:980px;height:66px;margin-bottom:20px;margin-left:-11px;margin-right:auto;padding:9px;}
.WAKimage {float:left;margin-left:2px;margin-top:0px;height:66px;border: 3px solid #006acc;position:relative}
.banner-title {padding:2px;margin-left:0px;width:468px;height:60px;position:absolute;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAD0lEQVQImWNgwA6MB1QQAFhxATM9UlO6AAAAAElFTkSuQmCC) #111;line-height:46px;text-align:center;font:bold 20px &#39;Iceberg&#39;,cursive;color:#7b7b7b;text-shadow:1px 1px 1px #000,-1px 1px 1px #000,-1px -1px 1px #000,1px -1px 1px #000;opacity:0.8;-webkit-transition:all 0.2s linear;transition:all 0.2s linear;-moz-transition:all 0.2s linear;width:468px;}
.WAKimageD {width:468px;height:60px;-webkit-transition:all 1s linear;}
.WAKimage:hover .banner-title {opacity:0;display:block;font-size:0px;height:0px}
#MIMAdz{background:rgba(0,0,0,0.5); width:950px; height:150px; border:3px solid #006acc; float:left; margin-left:0px;}
-webkit-transform:rotate(355deg); -o-transform:rotate(355deg)}
#MAdz{margin-top:0px; padding:0px; text-align:center;}
#MAdz img{border:3px solid #006acc; border-radius:70px; margin:1px 1px; text-align:center; padding:0px; margin-left:27px; -webkit-transition:all 0.5s ease-out; -moz-transition:all 0.5s ease-out; -o-transition:all 0.5s ease-out;margin-top:8px}
#MAdz img:hover{border:3px solid #006acc; -moz-transform:rotate(720deg); -webkit-transform:rotate(720deg); -o-transform:rotate(720deg);border-radius:0px}

• Itu baru Cssnya, kita masih harus memasang HTMLnya. Cari kode <div id='content-wrapper'>  dan letakan kode berikut tepat dibawahnya.

<div id='WAKBannerS'>
<div class='WAKimage'>
<a href='http://souldarkness777.blogspot.com/' title='They Will Be Eat Your Soul'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEWVruVkmhOxsjOWs5MH383ZxPp1jnpeli9dpNoLcIlbXryszmZVZbk3NQASib1TNZCTWxYx_qOtd-wteNjZJUWxNNnvm7pFz6O5kmlHgFZx_1Jl4FH_8MrcSe3yfut19AfUXcLOWtgDnG/s1600/NEW468X.png'/></a>
</div>
<div class='WAKimage'>
<a href='http://souldarkness777.blogspot.com/' title='They Will Be Eat Your Soul'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEWVruVkmhOxsjOWs5MH383ZxPp1jnpeli9dpNoLcIlbXryszmZVZbk3NQASib1TNZCTWxYx_qOtd-wteNjZJUWxNNnvm7pFz6O5kmlHgFZx_1Jl4FH_8MrcSe3yfut19AfUXcLOWtgDnG/s1600/NEW468X.png'/></a>
</div>
</div>
<div class='MIMAdz section' id='MIMAdz'><div class='widget HTML' id='HTML13'>
<div class='widget-content'>
<h3></h3>
<div id='MAdz'>
<a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a><a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a><a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a><a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a><a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a><a href='http://souldarkness777.blogspot.com/' target='_blank' title='They Will Be Eat Your Self'><img height='125' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKdWCNeHk3ieYdHofi0QE1wnLiV2e5VRaqsbcb17uIUgQ086dBG09Ylq6PnBeNAeI-6326nF-Jzr40r9AvZpidWs98LR0gOPsslu2aw1HdJGV8zvF8G5TAShXzGSQ9AvSk8h-m9bnzVqtF/s1600/NEW125X.gif' width='125'/></a>
</div>
</div>
</div>
</div>

• Nah, selesai deh. Untuk mengganti bannernya saya tak akan jelaskan karena saya tahu anda pasti bisa.
• Sekian

Gimana? mudah kan. Saya sarankan anda berkomentar agar blog ini makin maju dan top. Sekian dulu ya...