Advertise box (Hover Effect)
Adsense box..?? ada yang sudah tahu? atau bahkan sudah memasangnya di blog?, yup jika sudah maka saya tidak perlu menjelaskannya lagi dengan panjaaaang lebaar, tetapi pada adsense box anda cukup hanya dengan coding atau masih menggunakan gambar biasa? jika masih menggunakan gambar yang tentu saja akan menambah berat blog kalian maka kalian perlu meminimalisir berat blog anda dengan melihat tutorial dari MWcrew kali ini.
Seperti yang dibahas pada postingan MWcrew yang berjudul Adsense Box as like as Buysellads, postingan kali ini hampir sama dengan postingan sebelumnya tetapi letak keunggulan postingan kali ini adalah sebagai berikut :
tertarik untuk membuatnya?? Simak tutorialnya....
1. Pada Dasbor blog anda masuk ke Rancangan > Tambah gadget > Html / Java Script.
2. Masukkan kode dibawah ini.
Jangan lupa disimpan. Selamat mencoba.....
Seperti yang dibahas pada postingan MWcrew yang berjudul Adsense Box as like as Buysellads, postingan kali ini hampir sama dengan postingan sebelumnya tetapi letak keunggulan postingan kali ini adalah sebagai berikut :
- Tidak menggunakan gambar satupun
- Lebih mudah dipakai
- Lebih user friendly
- Hanya memakai widget (tanpa edit html)
- Cocok untuk pemula
tertarik untuk membuatnya?? Simak tutorialnya....
1. Pada Dasbor blog anda masuk ke Rancangan > Tambah gadget > Html / Java Script.
2. Masukkan kode dibawah ini.
Code :
<style> /*----MWcrew ads box start----*/ .ads { display: block; width: 280px; } .ads a { width: 125px; } .ads a img { padding: 0; } .ads a em { font-style: normal; } .ads a { color: #888888; display: block; float: left; font-family: verdana,sans-serif; font-size: 11px; margin: 0 7px 7px 0; overflow: hidden; text-align: center; text-decoration: none; } .ads img { border: 0 none; clear: right; } .ads a.image { background: none repeat scroll 0 0 #E7E7E7; border: 1px solid #CCCCCC; color: #666666; font-size: 12px; font-weight: bold; text-align: center; } .ads a.image:hover { background: none repeat scroll 0 0 #DDDDDD; border: 1px solid #999999; color: #333333; } .ads a { line-height: 100%; } .ads a.image { height: 125px; line-height: 1000%; width: 125px; } html > body .ads a.image { height: 123px; width: 123px; } #credits { float: right; font-size: 10px; margin-right: 35px; margin-top: -10px; } /*----MWcrew ads box end----*/ </style> <div id="advert"> <div class="ads"> <a href="#" class="image">Advertise here<img src="Image_Url" /></a> <a href="#" class="image">Advertise here<img src="Image_Url" /></a> <a href="#" class="image">Advertise here<img src="Image_Url" /></a> <a href="#" class="image">Advertise here<img src="Image_Url" /></a> </div> <div id="credits"> <p>Widget by <a href="http://mwcrew10.blogspot.com">MWcrew</a></p> </div> </div>
Note :
- Ganti kode "#" dengan link anda (misalnya dengan link contact me atau dsb...)
- Ganti "Image_Url" dengan Url gambar anda (Jika tidak diperlukan biarkan saja seperti itu)
Jangan lupa disimpan. Selamat mencoba.....