Cara Membuat dan Memasang IKLAN atau BANNER Melayang di Blog

Cara membuat iklan melayang atau cara memasang banner melayang di blog biasa disebut iklan Fload. Sekarang kita akan belajar cara membuat dan memasang banner atau iklan melayang di blog. Banner adalah sebuah gambar yang dipasang untuk mempromosikan suatu produk/acara tertentu. Bisa berupa iklan, informasi, maupun media promosi. Biasanya untuk menarik perhatian pengunjung, para blogger banyak cara yang dilakukan untuk menarik perhatian pengunjung terhadap iklan yang dipasang, namanya juga usaha. Usaha agar bagian terpenting yang mau kita tonjolkan dalam web/blog kita dapat dilihat atau diperhatikan oleh para pengunjung. Pernahkah Anda melihat ada situs web atau blog yang memasang iklan banner melayang di kanan atau di kiri blog?. Untuk membuat iklan melayang di blog seperti itu sangatlah mudah.

Cara Membuat dan Memasang IKLAN atau BANNER Melayang di Blog

Bagaimana cara membuat iklan melayang?. Cara memasang banner melayang di blog pada artikel ini saya akan berbagi pengetahuan tentang cara membuat iklan melayang di blog. Memasang iklan melayang atau floating di blog tidak sulit, karena kita cukup tahu scrip kode iklannya saja. Iklan merupakan hal yang sangat populer dikalangan neter dan pelaku bisnis online. Seorang blogger bisa menghasilkan puluhan juta dari jasa pemasangan iklan diwebsite yang dimilikinya. Tapi masih banyak para blogger yang masih bingung untuk memasang iklan dari si pengiklan yang meminta untuk memasang bannernya melayang atau floating di kiri atau di kanan.

Maka artikel kali ini akan membantu Anda cara memasang/membuat iklan (banner) melayang di blog. Hari ini saya akan bercerita tentang bagaimana cara memasang sebuah kotak iklan melayang yang sering di sebut dengan "Float Top Bar" ini. Anda pasti sudah pernah melihat iklan melayang atau pop-up di kanan atau kiri blog. Pemasangan iklan disamping blog banyak digunakan oleh blogger karena lokasi/posisi/letak iklan sangat menentukan apakah iklan tersebut berkinerja dengan baik atau tidak. Jika Anda adalah seorang blogger, tentunya Anda juga mempunyai hasrat yang sama dengan blogger lain.

Cara membuat dan memasang iklan atau banner melayang di blog selain akan mempercantik blog, juga ternyata banyak manfaat yang bisa kita dapatkan dengan membuat iklan melayang di blog, diantaranya iklan atau banner melayang ini bisa kita gunakan untuk sebuah iklan PPC. Biasanya iklan PPC yang mungkin tidak bisa ditampilkan secara utuh pada blog karena keterbatasan tempat pada halaman utama. Nah salah satu solusinya kita bisa memasang iklan PPC dengan menggunakan iklan atau banner melayang yang akan saya bahas pada artikel kali ini.

Cara membuat iklan melayang atau cara memasang banner melayang di blog yang akan saya bahas adalah dengan banyak variasi. Jika Anda tertarik untuk memasang iklan atau banner melayang di blog, berikut langkah langkah cara memasang iklan atau banner melayang di blog.
1. Login terlebih dahulu ke blog Anda
2. Lalu pilih "Tata Letak".
3. Klik "Tambahkan Gadget".
4. Lalu pilih HTML Javascript
5. Copy scrip kode iklan, lalu tempelkan kedalam Gadget. Dibawah ini beberapa scrip kode iklan yang bisa Anda pasanga.
Scrip kode iklan atau banner pertama

<style type="text/css"
>#gb{
position:fixed;
top:10px; z-index:+1000; } * html
#gb{position:relative;}
.gbcontent{
float:left;
margin-left:220px;
border:2px solid #bb0000;
background:#eeeeee;
padding:10px; }
</style> <script type="text/javascript">
function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0); gb.opened = !gb.opened; } function moveGB(x0, xf){ var gb = document.getElementById("gb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; gb.style.top = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id="gb"> <div class="gbtab" onclick="showHideGB()"> </div> <div class="gbcontent"> <div style="text-align:right"> <a href="javascript:showHideGB()"> .:[Close][Klik 2x]:. </a> </div><center>MASUKAN KODE IKLAN</center><script type="text/javascript">var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>

Keterangan:
~ Silahkan atur posisi dan warna widget atau banner Anda dengan mengganti kode yang berwarna Biru.
~ Untuk menempelkan/meletakkan kode iklan atau banner, ganti tulisan berwarna merah dengan kode iklan Anda.
~ Widget atau banner melayang yang saya posting dengan tombol close, jika diklik 2 kali iklan akan hilang.

Scrip kode iklan atau banner kedua


<style type="text/css"> #gb{ position:fixed; top:10px; z-index:+1000; } * html #gb{position:relative;} .gbcontent{ float:left;margin-left:220px; border:0px solid #000000; background:#eeeeee; padding:10px; } </style> <script type="text/javascript"> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0); gb.opened = !gb.opened; } function moveGB(x0, xf){ var gb = document.getElementById("gb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; gb.style.top = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id="gb"> <div class="gbtab" onclick="showHideGB()"> </div> <div class="gbcontent"> <div style="text-align:right"> <a href="javascript:showHideGB()"> .:[Close][Klik 2x]:. </a> </div> <center>MASUKAN KODE IKLAN</center> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>

Keterangan:
~ Widget atau banner iklan ini, saya sudah setting untuk berada di sebelah kiri. Untuk modifikasi Anda dapat mengubahnya dengan mengubah bagian yang sudah saya tandai kuning, dari tadinya left menjadi right (untuk widget/banner iklan melayang sebelah kanan).
~ Warna border saya setting jadi warna merah, untuk mengubahnya silahkan ubah kode warna di bagian yang sudah saya tandai orange solid #000000, sesuai dengan warna kesukaan Anda. Kode warnanya dapat Anda cari sendiri di Google.
~ Backgroud dapat Anda rubah sesuai dengan kehendak Anda sendiri, modifikasi dengan mengubah bagian yang sudah saya tandai biru. Kode warna cari di google.
~ Pada bagian warna merah, silahkan Anda masukkan kode HTML apa saja yang mau Anda buat melayang. Bisa kode iklan.
~ Widget atau banner melayang yang saya posting ini dengan tombol close, jika diklik 2 kali iklan akan hilang. 

Scrip kode iklan atau banner ketiga

<div style="position: fixed; top: 10px; left: 12px;"><embed src="MASUKAN KODE IKLAN"></embed></div>

Keterangan:
~ Widget atau atau banner iklan 'gak hanya bisa diletakkan di sidebar blog, tapi juga bisa melayang. Eiitzz.., melayang bukan berarti terbang kian kemari loh yah..,. Maksudnya, widget atau banner iklan ini akan selalu terlihat alias widget atau banner iklan gak pergi ke mana-mana banner berada tetap di posisinya meskipun scroll blog kita gerakkan.
~ top dan left artinya widget akan berada di bagian atas sebelah kiri halaman blog. Anda bisa ganti dengan bottom kalau Anda ingin widget di bagian bawah dan right kalau Anda ingin widget berada di sebelah kanan.
~ 10 dan 12 adalah jarak widget, artinya 10 dari atas dan 12 dari kiri. Anda boleh ganti sesuai keinginan.
~ MASUKAN KODE IKLAN dengan kode widget atau banner iklan yang akan di pasang.
~ Widget atau banner melayang ini tanpa tombol close. Jadi gak bisa ditutup.

Demikianlah tutorial "cara membuat dan memasang iklan atau banner melayang di blog" yang sudah agak lama dikenal oleh para blogger, tapi saya reposting kembali dengan variasi iklan atau banner melayang di blog yang bisa Anda pilih. Mulai dari cara membuat iklan melayang yang bisa di close dan tanpa close dan cara membuat iklan melayang disebelah kanan-kiri blog yag hampir sama saja dengan cara membuat iklan melayang di tengah atau di bagian footer blog yang bisa Anda setting. Namun, sebaiknya space iklan yang mau dipasang jangan sampai menggangu pengunjung blog ketika dia sedang bertamu. Kiranya cukup jelas penjelasan di atas tentang bagaimana cara membuat dan memasang iklan atau banner melayang di blog. Semoga mudah Anda aplikasikan.
Selamat Mencoba!.





Add Your Comments

Disqus Comments