Friday, July 6, 2018

Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan

Cara Merapikan Widget dan Membuat Iklan Saling BersampinganAssalamualaikum Wr Wb, Hallo Kawan - kawan Hobbyku Desain | TrendingKita | Tutorial Desain Dan Blog, Pada Artikel yang kami buat dan juga anda baca kali ini dengan judul Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan Artikel BelajarBlog #2 - Hiasan, yang kami tulis ini dapat anda pahami dan juga bermanfaat.

Download Kumpulan Wallpaper Mobile Legends di MasMochen

Judul Artikel: Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan
link : Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan

Baca juga


Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan

Ketika saya mencoba untuk menjadi publisher di kliksaya, saya mengalami sedikit kendala karena ukuran banner iklan yang tersedia kurang sesuai dengan ukuran ukuran kolom pada template yang saya miliki. Ukuran-ukuran yang ada pada situs kliksaya tersebut di antara nya :
  1. 125x125 dan 300x250 (Persegi)
  2. 468x60 dan 728x90 (Horisontal)
  3. 120x600  dan 160x600 (Vertikal)
Sementara ukuran kolom template yang saya gunakan sampai februari 2015 adalah 212px pada sisi kanan dan ukuran 425px untuk kolom kiri (jajaran artikel post). Sehingga memilih untuk menggunakan ukuran iklan manapun, hampir tidak ada yang cocok untuk diletakan di bagian kanan (sidebar) karena terlalu besar ataupun terlalu kecil. Memilih iklan untuk diletakan di bagian atas artikel pun sebenarnya tidak ada ukuran yang benar-benar cocok. Sampai akhirnya saya menemukan ide untuk mengambil iklan ukuran persegi 125x125 untuk diletakan di bagian atas artikel, serta merapikannya dengan table.

Jika anda belum berpengalaman menggunakan table untuk merapikan widget (termasuk iklan maupun banner), kurang lebih beginilah cara merapikan iklan dengan table agar berjejer kesamping.

Langkah-Langkah Merapikan Iklan berjejer :
Masuk ke tata letak di blog yang anda miliki
Pilih Tata Letak kemudian tambah Widget HTML
Buat Script HTML Seperti Berikut :

</div>
<table><tr>
<td>Widget A yang Dikehendaki</td>
<td></td>
<td>Widget B yang Dikehendaki</td>
<td></td>
<td>Widget C yang Dikehendaki</td>
</tr></table>
</div>

Pada Kasus Kali ini, Script dari Widget yang ingin saya pasang misalnya ketiga-tiganya sebagai berikut :
<a title="Blog Pelajar Terbaik" href="http://pelajarterbaikupi.blogspot.com" target="_blank"><img alt="Kunjungi Blog Pelajarterbaik" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzHbyIjkuvA5X_NRSt59rI0FmplJz4C79ssGqCC1LIV5vRcTfDxGU9T3ufmj1ErSUtXbPZfovl6JIQhix5eTr2cxprGZx_k2Nz9_uZnQeFxKAw9DOoapmT-Y6RXQzGXeSjQXSLw65sots/
s1600/Mahfudin_IW.gif" width="125px" height="125px"/></a>

Maka Tampilan yang akan diperoleh ketika Script tersebut dimasukan ke dalam Script HTML di atas adalah sebagai berikut :

Kunjungi Blog PelajarterbaikKunjungi Blog PelajarterbaikKunjungi Blog Pelajarterbaik

Jika Kita ingin menambah jarak antar gambar tersebut, maka kita cukup membuat kolom kosong lebih banyak lagi (HTML yang berwarna merah) sebanyak yang kita perlukan. Jika melihat polanya, tentu anda memahami bagaimana jika ingin menambahkan lebih banyak widget lagi, sehingga bukan sekedar tiga widget.

Teknik tabel ini, juga sering digunakan untuk merapikan foto-foto di blog, sehingga kumpulan foto (galeri) tersebut bisa lebih rapi karena di atur berjejer seperti gambar di atas.



Demikianlah Artikel Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan

Demikian artikel Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan yang kami tulis kali ini, Semoga artikel diatas dapat memberi manfaat untuk anda semua yang membaca. Sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Cara Merapikan Widget dan Membuat Iklan Saling Bersampingan dengan alamat link https://hobbykudesign.blogspot.com/2018/07/cara-merapikan-widget-dan-membuat-iklan.html
Download Kumpulan Wallpaper Mobile Legends di MasMochen


EmoticonEmoticon