Membuat Kotak Iklan di Blog

Cara membuat kotak iklan di blog sebenarnya sudah lama ingin saya posting, namun ada saja kendala yang menghambat saya untuk mempostingya sehingga postingan cara membuat kotak iklan ini menjadi tertunda. Pada kesempatan yang berbahagia ini, mumpung ada waktu luang, saya akan mempostingnya dan membagikan panduan dan cara membuat blog khususnya pada cara membuat kotak iklan ini kepada Anda yang ingin memasang kotak iklan pada blog yang Anda miliki.

Membuat space kotak iklan pada blog akan memberi peluang bagi Anda untuk mendapatkan rupiah yang Anda inginkan. Karena ketika Anda membuat space kotak iklan diblog yang Anda miliki, secara tidak langsung Anda memberi kesempatan bagi orang lain yang ingin memasang iklan pada blog Anda. Apalagi jika blog yang Anda sudah popular dan memiliki trafic serta page rank dari google yang tinggi, maka pemasang iklan akan terus berdatangan untuk memasang iklan pada blog Anda. Namun tidak ada salahnya jika blog Anda belum memiliki trafic yang tinggi juga ingin menyediakan space kota iklan, yang jelas peluang untuk mendapatkan rupiah dari iklan itu tetap ada. Mungkin saja sipemasang iklan juga ingin memasang iklannya pada blog Anda, kan lumayan uangnya bisa dikumpul buat beli peyek, hehe..

Bagi anda yang tertarik untuk membuat kotak iklan di blog, yuk sama-sama kita simak tutorial berikut ini :

1. Siapkan gambar atau image yang ingin kita pasang pada space iklan yang berukuran 125 x 125 px, agar gambar kelihatan menarik dan memiliki efek silahkan Anda baca membuat banner animasi dan flash. Kemudian simpan gambar tersebut pada hosting penyipanan gambar seperti photobucket untuk mendapatkan url gambar yang nantinya kita butuhkan.

contohnya:

2. Jika sudah, kita akan membuat space kotak iklannya, login ke account blogger Anda
3. Klik rancangan atau tataletak bagi yang menggunakan dasbor blogger baru
4. Kemudian klik Edit HTML dan cari kode ]]></b:skin> (gunakan ctrl + f ) untuk mempermudah pencarian
5. Sisipkan kode berikut ini diatas kode ]]></b:skin>

#super-beeads {margin:0px;padding:0px;text-align:center}
#super-beeads  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;}
#super-beeads img:hover {-moz-opacity: 0.7;opacity: 0.7;filter:alpha(opacity=70);}

Perhatikan kode yang saya beri warna, untuk warna merah merupakan jarak antara kotak iklan atas dan bawah. Sedangkan warna biru merupakan jarak kotak iklan antara kiri dan kanan. Sesuaikan dengan kebutuhan Anda.

6. Kemudian save template Anda
7. Langkah selanjutnya kembali ke Elemen laman dan klik tambah gadget > pilih HTML/Javascript
8. Copy dan paste kode berikut ini (edit terlebih dahulu untuk memasukkan link dan url gambar gambar yg ingin digunakan):

<div id="super-beeads">
<a href="Masukkan-Url" target="_blank" title="Title-Iklan"><img alt="Alt/Text Gambar" border="0" src="Url Gambar" /></a>
<a href="Masukkan-Url" target="_blank" title=" Title-Iklan"><img alt="Alt/text Gambar" border="0" src="Url Gambar" /></a>
<a href="Masukkan-Url" target="_blank" title="Title-Iklan"><img alt="Alt/Text Gambar" border="0" src="Url Gambar" /></a>
<a href="Masukkan-Url" target="_blank" title="Title-Iklan"><img alt="Alt/Text Gambar" border="0" src="Url Gambar" /></a>
</div>

space kotak iklan diatas merupakan space kotak iklan yang terdiri dari 4 bagian yaitu atas kiri, atas kanan dan bawah kiri serta bawah kanan. Jika Anda ngin mengurangi space kotak iklan, anda dapat menghapus kode  <a href="MASUKKAN-URL" target="_blank" title="TITLE-IKLAN"><img alt="ALT/TEXT GAMBAR" border="0" src="URL GAMBAR" /></a> diatas.

9. Save kerjaan Anda dan lihat hasilnya

Demikianlah cara membuat kotak iklan di blog yang dapat saya sampaikan, sampai jumpa pada tutorial berikutnya dan saya ucapkan selamat mencoba.

Tweet