Pada postingan kali ini saya aan berbagi tips  cara membuat widget melayang pada blog. Widget yang melayang - layang di blog biasanya digunakan untuk menampilkan iklan, mugkin karena alasan blognya sudah penuh dengan tampilan widget atau karena alasan agar widget ini ingin ditonjolkan oleh pemilik blog. 

Walaupun pada kenyataan nya para pengunjung blog seringkali merasa terganggu dengan keberadaan tampilan widget yang melayang ini, karena menutupi isi / artikel blog yang sedang dibaca oleh pengunjung, oleh karena itu saya sendiri tidak menggunakan cara ini.

Tapi jika Anda tertarik untuk menggunakannya dalam blog Anda, maka  silahkan ikuti langkah - langkah nya sama seperti pada postingan cara memasang widget /gadget pada blog, antara lain::
  1. Langkah pertama adalah login ke akun blogger
  2. Kemudian pilih menu lay out atau "tata letak"
  3. klik "tambah gadget" 
  4. Pilih gadget/widget dengan konfigurasi "HTML/JavaScript" dengan cara klik tombol  + yang terletak pada sebelah kanan widget tersebut
  5. Copy dan paste kode Berikut:
    <style type="text/css"> #gb{ position:fixed; top:10px; z-index:+1000; } * html #gb{position:relative;} .gbcontent{ float:left;margin-left:250px; border:1px solid #bb0000; background:#eeeeee; padding:15px; } </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 (PASTE) SRIPT / KODE ISI WIDGET YANG INGIN DITAMPILKAN MELAYANG - LAYANG DISINI </center> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>
  6. Anda bisa memodifikasi / mengatur tampilan widget dengan cara memodifikasi text / kode yang berwarnah biru atau ungu pada kode diatas sesuai dengan kebutuhan Anda
  7. Setelas selesai memodifikasi, kemudian klik "Simpan"
  8. Selesai, Anda bisa melihat asilnya, kemudian jika ada yang kurang berkenan, adnda bisa mengeditnya kembali
Demikian tips  cara membuat widget melayang pada blog dari saya, semoga bermanfaat.