Cara Membuat Banner 88x31 Auto Hide di Atas Footer
Assalamualaikum sobat. kali ini saya akan berbagi trik yang cukup sederhana.Trik ini saya berinama "Cara Membuat Banner 88x31 Auto Hide di atas Footer". Lumayan Panjang yah namanya.Yang Sebelumnya Saya Mempublikasikan sebuah artikel yang berjudul "Cara Membuat Banner 125x125 di Sidebar Blog".Emang udah serba banner yah zaman sekarang.Trik ini sebelumnya dipostkan oleh Go! Blog.dan mungkin tidak banyak yang saya edit.
Sebelum di Hover |
Setelah di Hover |
- Login ke Blogger
- Masuk ke Menu edit template >> Edit HTML
- Lalu Cari kode ]]></b:skin> dan letakan kode dibawah ini tepat diatas kode tadi
#MZT-Blog-Banner{margin-top: -11px;
margin-left: -2px;
width: 968px;
height: 28px;
margin-bottom: 10px;
text-align: center;
background: #ddd;
border: 3px solid#ff5600;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
overflow: hidden;
-webkit-box-shadow: 0px 0px 10px #ff5600;
-mox-box-shadow: 0px 0px 10px #ff5600;
-ms-box-shadow: 0px 0px 10px #ff5600;
-o-box-shadow: 0px 0px 10px #ff5600;
box-shadow: 0px 0px 10px #ff5600;}
#MZT-Blog-Banner h2{color: #ff5600;
font-family: nova square;
margin-bottom: 5px;
font-size: 16pt;
text-align: center;
border-bottom: 2px solid #ff5600;
height: 27px;
}
#MZT-Blog-Banner:hover{height:75px;}
#team{position:absolute;margin-left:280px;height:310px;width:210px;overflow:hidden;background:transparent;margin-top:-150px;}
- Kemudian Cari Kode Footer-wrapper kamu dan letakan kode dibawah ini tepat diatas kode Footer-wrappermu
<div id='MZT-Blog-Banner'><h2>Banner Footer</h2>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
<a href='http://maverickzetta.blogspot.com/' title='Maverick-Zetta'><img alt='This My Zetta Zone' src='http://i.imgur.com/gtrpB10.png'/></a>
</div>
- Simpan Template
Nah, bagaimana sob.. Cukup jelas kan..
Sekian dan semoga bermanfaat..
Terimah Kasih
11 komentar
nyot nyot...:))
Balas[+] http://dholmaru.blogspot.com [+]
Thanks Gan. Ini nih yang ane cari - cari.
BalasKomenback Ya! :D
Good Job bro..
Balas(h)
Sama-Sama Gan..
BalasKomenback meluncur.. :-)
Thanks Sob.. :-)
BalasTy gan, ane langsung coba gan,
Balaskunjungan Balik Segera gan :D
bloggerunix.blogspot.com
Oke gan.. :)
Balastukeran banner yuk,cek aj alexanya di
Balashttp://fajar-pkp.blogspot.com
Silahkan ke Menu Tukar banner pak..
BalasDisini http://zetta-zone.blogspot.com/p/exchange.html
Keren Mas !
BalasComment Back Ya !
keren gan, Ketauan Adminnya Gnteng Nh... hehehe
Balasvisit my blog https://thepinkiboy.blogspot.com/
Terima Kasih Telah Berkunjung Ke Blog yang Sederhana ini.Jika Anda ingin berkomentar mohon jangan Out Of Topic (OOT) dan sebarkan link-link porno dan sara.Sekian, Terimah Kasih.