Cara Buat Widget Iklan Melayang di Blog

Iklan
Tutorial kali saya akan memberikan tentang cara buat iklan melayang di blog. Iklan melayang biasanya tampil ketika sebuah blog dibuka maka akan tampil sebuah jendela baru yang sedikit menutupi isi blog. Jendela ini biasanya memiliki banyak fungsi diantaranya untuk menaruh iklan, ucapan selamat datang, dsb.

Cara membuat iklan melayang ini sangatlah mudah dan simpel, sebelumnya sobat bisa lihat contohnya pada situs berikut :
http://pola-sehat.blogspot.com/
Dan tampilannya seperti gamabr berikut ini :



Nah, berikut Tutorial Buat Iklan Melayang di Blog

1. Login ke Dashboard blog sobat,
2. Lalu langsung menuju ke => Tata Letak => Elemen Halaman => Tambah Gadget => HTML/Javascript
3. Lalu copy kan kode  berikut kedalamnya :




<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}


.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
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>

Taruh di sini IKLAN atau Text yang akan ditampilkan

</center>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></center></div></div>
Perhatikan :
# Taruh Iklan atau Text sobat pada tulisan yang berwarna merah.
# Yang berwarna kuning sobat bisa ganti sesuai keinginan sobat untuk tombol CLOSE nya
# Untuk berwarna Hijau ganti angkanya sesui blog sobat, itu merupakan ukuran/jarak dari Atas.
# Dan yang berwarna biru ganti angkanya untuk merubah ukuran Window/jendela yang akan tampil.

4. Lalu save hasil diatas, dan refresh blog sobat. lihat hasilnya..

Thank's to : Ecaknyo