Cara Membuat Banner Iklan Floating (Melayang) Kiri dan Kanan di Blog

Kali ini Saya akan membahas Cara Membuat Banner Iklan Floating Kiri dan Kanan di Blog.
Dalam dunia bisnis online banyak blogger membutuhkan pengiklan, tapi pengiklan tersebut pun tidak sembarang pengiklan. Banyak dari blogger yang masih bingung untuk memasang iklan dari si pengiklan yang meminta untuk memasang bannernya melayang atau floating di kiri dan kanan. Sebenarnya untuk membuatnya sangat mudah, Anda hanya perlu copy paste script yang ada di bawah ini dan edit di Edit HTML.

Cara Membuat Banner Iklan Floating (Melayang) Kiri dan Kanan

Berikut caranya :

  • Login ke blogger.com, jika sudah
  • Pilih Template → Cari kode ]]></b:skin>
  • Letakkan script di bawah ini di atas ]]></b:skin>

#ads-close{
background: none repeat scroll 0 0 #000000; border: 2px solid #888888; border-radius: 15px 15px 15px 15px; color: white; font-weight: bold; height: 20px; margin-right: -24px; margin-top: -18px; padding: 0 0 20px; position: absolute; right: 0; width: 24px;}
#ads-closes{
background: none repeat scroll 0 0 #000000; border: 2px solid #888888; border-radius: 15px 15px 15px 15px; color: white; font-weight: bold; height: 20px; margin-right: 147px; margin-top: -20px; padding: 0 0 20px; position: absolute; right: 0; width: 24px;

  • Setelah itu cari kode </head>
  • Letakkan script di bawah ini di atas kode </head>

<script type=’text/javascript’>$(document).ready(function(){$(&quot;#ads-close&quot;).click(function(){$(&quot;#ads-float&quot;).hide(); setTimeout(function() {$(&quot;#ads-float&quot;).show(10);},100000000);} ); });</script>
<script type=’text/javascript’>$(document).ready(function(){$(&quot;#ads-closes&quot;).click(function(){$(&quot;#ads-floats&quot;).hide(); setTimeout(function() {$(&quot;#ads-float&quot;).show(10);},100000000);} ); });</script>

  • Setelah itu letakkan script di bawah ini di bawah kode </head>

<div id=’ads-floats’ style=’position: fixed; top: 30px; right: 0px; z-index: 99999;’><button id=’ads-closes’>x</button>Letakkan script banner Anda di sini kira-kira ukuran 600×160 PxL</div>
<div id=’ads-float’ style=’position: fixed; top: 30px; left: 0px; z-index: 99999;’><button id=’ads-close’>x</button>Letakkan script banner Anda di sini kira-kira ukuran 600×160 PxL</div>

  • Contoh yang pernah Saya buat :

<div id=’ads-floats’ style=’position: fixed; top: 30px; right: 0px; z-index: 99999;’><button id=’ads-closes’>x</button><a href=’http://goo.gl/YaXPT’ target=’_blank’><img border=’0′ height=’600′ marginheight=’0′ marginwidth=’0′ scrolling=’no’ src=’http://softwarepsr.com/images/banner/banner-gif-160-600-a.gif’ width=’160’/></a></div>
<div id=’ads-float’ style=’position: fixed; top: 30px; left: 0px; z-index: 99999;’><button id=’ads-close’>x</button><iframe frameborder=’0′ height=’600′ marginheight=’0′ marginwidth=’0′ scrolling=’no’ src=’http://blog6.autoklikreload.com/’ width=’160’/></div>

  • Preview dulu sebelum Anda menyimpan, jika tidak ada kesalahan, simpan saja dan lihat hasilnya.
Selamat Mencoba dan Semoga Bermanfaat !