Membuat banner berjajar secara horisontal

Banner adalah iklan yang tampil didalam halaman website. Banner ditempatkan pada posisi yang menarik sehingga pengunjung dengan mudah melihatnya dan jika klik banner tersebut maka akan muncul informasi yang relevan atau masuk ke website Anda.

Dalam memasang banner hal yang perlu diperhatikan adalah penataan yang strategis agar mudah dilihat dan disesuaikan dengan komposisi template web. Jadi tidak asal tempel karena mata pengunjung tidak suka melihat seuatu yang kurang menarik.

Pemasangan banner iklan dapat disusun secara vertical dari atas ke bawah juga secara horizontal arah menyamping dari kiri ke kanan. Tergantung selera masing-masing pemilik blog. Tapi saya pribadi lebih suka pada susunan yang horizontal menyamping karena akan langsung terlihat semua tanpa harus memutar scroll mouse, apalagi bila ada banyak banner yang akan dipasang.

Simple saja sebenarnya menata banner agar dapat dipasang berjajar menyamping horizontal memerlukan tips khusus, yaitu dengan memanfaatkan fungsi table.
Berikut ini kode yang diperlukan :

<table border="0" cellpadding="2" cellspacing="0" style="border-collapse: collapse"
border width="383">
<tr>
<td>kode banner1</td>
<td>kode banner2</td>
<td>kode banner3</td>
</tr>
</table>

Tetapi perlu diingat usahakan ukuran bannernya sama, misalnya jika banner 1 berukuran 125x125 px maka banner ke-2 dan ke-3 juga 125 x 125 px, tujuannya agar setelah jadi akan terlihat rapih.

Baiklah saya contohkan misalnya saya akan memasang tiga buah banner iklan.

Banner 1 memiliki kode :
<a href='http://infonetmu.blogspot.com' target='blank'> <img src='https://sites.google.com/site/brugkembar/home/sertifiksai.gif' alt='panduan sertifikasi guru-profesi'></a>

Banner 2 memiliki kode :
<a href='http://infonetmu.blogspot.com' target='blank'> <img src='https://sites.google.com/site/brugkembar/home/bisintrnt.gif' alt='berburu backlink dofollow'></a>

Banner 3 memiliki kode :
<a href='http://infonetmu.blogspot.com' target='blank'> <img src='https://sites.google.com/site/brugkembar/home/stbl.gif' alt='cara menseting blogspot'></a>

Sehingga lengkapnya menjadi :

<table border="0" bordercolor="#111111" cellpadding="2" cellspacing="0" style="border-collapse: collapse; width: 383px;">

<tr><td><a href="http://infonetmu.blogspot.com" target="blank"> <img alt="panduan sertifikasi guru-profesi" src="https://sites.google.com/site/brugkembar/home/sertifiksai.gif"></a></td>

<td><a href="http://infonetmu.blogspot.com" target="blank"> <img alt="berburu backlink dofollow" src="https://sites.google.com/site/brugkembar/home/bisintrnt.gif"></a></td>

<td><a href="http://infonetmu.blogspot.com" target="blank"> <img alt="cara menseting blogspot" src="https://sites.google.com/site/brugkembar/home/stbl.gif"></a></td>
</tr></table>

Maka kode tadi bila dipasang dengan benar akan menghasilkan tampilan banner seperti di bawah ini:

BACA JUGA!
- Cara agar Postingan Baru Tidak Muncul Di Halaman Utama
- Cara membuat menu pull down blogger
- Menonaktifkan klik kanan mouse pada blog
- Membuat recent post fungsi scroll dengan javascript
- Membuat judul posting berkedip
- Cara memasang emotion pada komentar blog
- Memasang Emotion pada Blogger
- Kode CSS Border Padding dan Margin
- Cara memasang form email berlangganan dari feed burner google
- Cara memasang widget pagerank
- Membuat sidebar dalam kotak yang terpisah