Cara Membuat Tampilan Kotak Iklan Di Blog Jadi Lebih Keren

Cara Membuat Tampilan Kotak Iklan Di Blog Jadi Lebih Keren - The Kolor Superman akan berbagi sebuah informasi menarik dan penting untuk kamu seputar tampilan kotak iklan yang akan kita sulap jadi lebih keren. Jika biasanya iklan terlihat dalam bentuk persegi, maka kali ini beda dan jauh lebih keren tampilan iklan di blog Anda. Judul yang digunakan pada artikel ini adalah Cara Membuat Tampilan Kotak Iklan Di Blog Jadi Lebih Keren.

Ini contoh iklan / Screenshotnya :

Silahkan simak cara membuat tampilan iklan seperti gambar diatas :



1. Pertama , Login BLOGGER
2. Pilih RANCANGAN , Lalu EDIT HTML, Lalu Cari kode ]]></b:skin>
3. Lalu , Letakkan Kode Dibawah ini diatas kode ]]></b:skin> :

/* Box mbs ads - www.MafiaSitez.blogspot.com*/
#box-mbs-ads {margin:0px;padding:0px;text-align:center}
#box-mbs-ads img {background:#222;height:120px;width:120px;margin:1px 1px;border:0;text-align:center;border-radius:50% 0 50% 0;-o-border-radius:50% 0 50% 0;-moz-border-radius:50px 0 50px 0;-webkit-border-radius:50% 0 50% 0;-o-border-radius:50% 0 50% 0;border:5px solid #666;-webkit-border:5px solid #666;-moz-border:5px solid #666;-webkit-box-shadow: 1px 2px 1px #000;-moz-box-shadow: 1px 2px 1px #000;box-shadow: 1px 2px 1px #000;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;}
#box-mbs-ads img:hover {border-radius:0 50% 0 50%;-o-border-radius:0 50% 0 50%;-moz-border-radius:0 50% 0 50%;-webkit-border-radius:0 50% 0 50%;-o-border-radius:0 50% 0 50%;-moz-opacity:0.8;-webkit-opacity:0.8;opacity:0.8;filter:alpha(opacity=80);}

Ket :

4. Kode Yang berwarna HIJAU Adalah Tinggi dan Lebar, Silahkan sobat ganti angka 120 sesuai lebar dan tinggi gambar yang sobat inginkan.
-Kalau sudah klik SAVE TEMPLATE ya?-

5. Selanjutnya menuju pada Elemen Halaman dan Tambah Gadget lalu pilih HTML/Javascript dan masukkan kode berikut.

<div id='box-mbs-ads'>

<a href='URL-HERE-1' target='_blank' title='TITLE-HERE-1'><img alt='' src='URL-GAMBAR-1'/></a>

<a href='URL-HERE-2' target='_blank' title='TITLE-HERE-2'><img alt='' src='URL-GAMBAR-2'/></a>

<a href='URL-HERE-3' target='_blank' title='TITLE-HERE-3'><img alt='' src='URL-GAMBAR-3'/></a>

<a href='URL-HERE-4' target='_blank' title='TITLE-HERE-4'><img alt='' src='URL-GAMBAR-4'/></a>

<a href='URL-HERE-5' target='_blank' title='TITLE-HERE-5'><img alt='' src='URL-GAMBAR-5'/></a>

<a href='URL-HERE-6' target='_blank' title='TITLE-HERE-6' ><img alt='' src='URL-GAMBAR-6'/></a>
</div>

- Untuk kode yang berwarna merah Anda ganti sesuai dengan alamat url iklan banner yang Anda pasang dan untuk yang berwarna kuning adalah url gambar iklan.

Sekian pembahasan tentang Cara Membuat Tampilan Kotak Iklan Di Blog Jadi Lebih Keren, semoga bermanfaat.