Cara Membuat Widget Melayang atau popup di Halaman Blog

Masih dalam seputar ngeblog kali ini Ngeblog Aja akan mencoba berbagi Cara Membuat Widget melayang,dari judulnya aja udah dapat di simpulkan bahwa widget ini akan melayang-layang di blog walaupun scrol mouse di tarik maju mundur.Bagi publiser iklan widget ini akan sangat berguna untuk menaikan pendapatan dari PPC karena penempatan iklan tersebut langsung akan menarik perhatian para visitor walaupun ada sebagian PTC yang melarang keras menempatkan iklan meraka di widget seperti yang sedang kita bahas ini,disamping itu pengunjung juga akan sangat terganggu saat sedang membaca atikel kita.so...apakah sobat masih mau menggunakan widget melayang untuk menempatkan iklan PTC dan sejenisnya? itu semua kembali pada sobat sendiri,tapi bagi yang ingin memasngnya silakan simak petunjuk singkat di bawah ini:

1. Login Ke blogger
2. Pilih Rancangan
3. Pada elemen halaman klik ''Tambah widget''
4. Dan pilih Widget HTML/Javascript
5. Copy dan pastekan code di bawah ini:
6. Trus Simpan.

<style type="text/css">
#gb{ position:fixed; top:0px;left:0px; z-index:+1000; } * html #gb{position:relative;} .gbcontent{ border:2px solid #bb0000; background:#eeeeee; padding:5px; }
</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> tempatkan iklan bannr atau widget di sini</center> <script type="text/javascript">
var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></div>
</div>

.:[Close][Klik 2x]:.

tempatkan iklan bannr atau widget di sini

Lihat Contohnya di Pojok kiri Atas.
NB :Pada kode yang berwarna biru di atas, adalah nilai pengaturan untuk posisi, background,dan border widget tersebut. Untuk yang berwarna merah adalah letak script sobat entah itu script Iklan,banner,gambar atau widget lain misal facebook fanspage.

SELAMAT MENCOBA
Salam Buat Temen-temen yang selalu setia kunjungi blog ini.
Tipnya Ngeblog Aja akan selalu share trik dan tips seputar Blogger dan Sebagainya.

Baca Juga