Space Banner iklan Menarik Untuk Blog

Space Banner Menarik Untuk Blog

14.05 | Minggu, 29 April 2012  Yasir Utomo  6 comments

Sebelumnya kita sudah pernah bahas mengenai space banner yaitu :

• Cara Membuat Banner Bergerak Bolak Balik
• Membuat Iklan Banner Ukuran 125 x 125

Kali ini kita akan mencoba membuat space banner yang berbeda dan sedikit memiliki efek. Efeknya apa? Space banner ini akan mempunyai rekasi terhadap visitor blog Anda yang mengarahkan kursornya pada space banner tersebut, efeknya adalah space banner yang disorok kursor akan lebih cerah dibanding dengan yang tidak. Anda juga bisa memadukannya dengan menggunakan gambar animasi.

Contoh :

Banner kanan kondisi sedang disorot oleh kursor.

Space banner ini juga tidak dibatasi dari lebar atau tinggi, memasang 2 atau lebih banner akan langsung disesuaikan dengan tinggi dan lebar. Tertarik dengan segala kelebihannya, mari ikuti langkah pembuatannya :

1. Masuk pada blogger.com
2. *Karna blogger telah memakai interface baru jadi mulai dari posting ini semua tutorial blog dari www.katakan-hey.com akan  menggunakan format interface baru Blogger. Informasi lanjut mengenai interfacebaru Blogger Disini :)
   Pilih Template >> Edit HTML >> Lanjutkan
3. Cari kode berikut :
   

   ]]>

Copy dan tempatkan kode berikut tepat diatas ]]>

 :

#spaceads {margin:0px;padding:0px;text-align:center}
#spaceads  img {margin:1px 1px;text-align:center;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;-webkit-box-shadow: 1px 2px 1px #ccc;-moz-box-shadow: 1px 2px 1px #ccc;box-shadow: 1px 2px 1px #ccc;}
#spaceads img:hover {-moz-opacity: 0.7;opacity: 0.7;filter:alpha(opacity=70);}

Simpan Template terlebih dahulu

Beralih dan pilih Tata Letak

Pilih kolom gadget tempat space banner akan ditempatkan

Pilih HTML/JavaScript pada gadget tersebut

Pastekan kode berikut :

URL TUJUAN

" target="_blank" title="TITLE BANNER">ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" />
URL TUJUAN" target="_blank" title="TITLE BANNER">ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" />
URL TUJUAN" target="_blank" title="TITLE BANNER">ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" />
URL TUJUAN" target="_blank" title="TITLE BANNER">ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" />Keterangan :

• URL TUJUAN Ganti dengan alamat URL Tujuan dari banner/iklan
• TITLE BANNER Ganti dengan judul dari iklan
• ALT/TEXT GAMBAR Ganti dengan text gambar yang akan tampil jika disorot kursor
• URL GAMBAR Ganti ddengan URL gambar dari banner/iklan

Simpan Widget dan lihat hasilnya

Selamat Mencoba & Happy Blogging

Beli Sekarang :

Chat WhatsApp SMS 082111111111 Call 082111111111