Space Banner iklan Menarik Untuk Blog

Space Banner Menarik Untuk Blog


Sebelumnya kita sudah pernah bahas mengenai space banner yaitu :
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 :
  • " 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

    Komentar (0)

    Posting Komentar