Minggu, 16 Januari 2011

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:


panduan 
sertifikasi guru-profesi berburu backlink dofollow cara 
menseting blogspot





0 komentar:

Posting Komentar

Crazy Sofer © 2010 Template by:
FeRay