Anda di halaman 1dari 2

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. 

Anda mungkin juga menyukai