24 August 2010

Menata banner berjajar menyamping horizontal

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"
bordercolor="#111111" 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://brugkembar.blogspot.com/2010/05/pedoman-sertifikasi-guru-non-pns-dan.html' 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://brugkembar.blogspot.com/2010/08/berburu-backlink-dari-blog-dofollow-pr.html' 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://brugkembar.blogspot.com/2010/07/panduan-cara-setting-blog-di-blogspot.html' 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://brugkembar.blogspot.com/2010/05/pedoman-sertifikasi-guru-non-pns-dan.html" target="blank"> <img alt="panduan sertifikasi guru-profesi" src="https://sites.google.com/site/brugkembar/home/sertifiksai.gif"></a></td>

<td><a href="http://brugkembar.blogspot.com/2010/08/berburu-backlink-dari-blog-dofollow-pr.html" target="blank"> <img alt="berburu backlink dofollow" src="https://sites.google.com/site/brugkembar/home/bisintrnt.gif"></a></td>

<td><a href="http://brugkembar.blogspot.com/2010/07/panduan-cara-setting-blog-di-blogspot.html" target="blank"> <img alt="cara menseting blogspot" src="https://sites.google.com/site/brugkembar/home/stbl.gif"></a></td>
</tr></table>

Catatan:
Teks berwarna merah adalah kode banner milik saya, silahkan anda ganti dengan yang kode lain punya anda sendiri.

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


panduan sertifikasi guru-profesi berburu backlink dofollow cara menseting blogspot

Selamat Menata banner supaya berjajar menyamping horizontal.

12 comments:

  1. blog walking,,
    feedback boss..
    www.deevro.co.cc..
    thnkz ..

    ReplyDelete
  2. @deevro, sudah kutengok blog ente serem tapi keren
    makasih juga atas kunjungannya

    ReplyDelete
  3. Anonymous28.1.11

    boleh bos artikelnya ane posting ulang di blog ane artoyo.blogspot.com....sori bos pingin bikin blog tidak punya bahan...

    ReplyDelete
  4. @toyosrg@gmail.com, silahkan mas asal sertakan link sumbernya.

    ReplyDelete
  5. Sip genk mau praktek. yang mo join bisnis hasil laut http://kunosaja.blogspot.com/

    ReplyDelete
  6. terima kasih infonya..:)mantapp..wong tegal yo mass..

    ReplyDelete
  7. @http://aristayomani.blogspot.com/, thanks dah kunjung ke blog brugkembar Tegal

    ReplyDelete
  8. mas cara masang banner biar ringkas masudnya baner2 teman kan banyak tapi mau qw ringkas kayak berjalan ke atas lajunya itu bagaimana mas

    ReplyDelete
  9. thanks infonya ...
    sangat membantu sekali :)
    semoga dibalas kebaikannya karena mau berbagi ilmu :)

    ReplyDelete
  10. Thanks ilmunya bro.. penataan banner yg rapi memang pantas diperhitungkan

    ReplyDelete
  11. Makasih tipsnya mas, sangat berguna.

    ReplyDelete

Note: Only a member of this blog may post a comment.