Farhan Share - Cara membuat widget melayang di blog, nah sobat farhan sekarang farhan mau nge-share tentang Bagaimana cara memasang widget melayang di blog. pastinya seru kan sobat? blog kita akan lebih menarik dan juga biasanya widget ini berfungsi sebagai untuk memasang iklan atau ucapan kata-kata sapaan, widget ini posisinya juga bisa kita atur semau kita, bisa di atas (top), di tengah (center), di bawah (bottom), di kanan (right), di kiri (left). Oh ya di dalam widget ini kita juga bisa menyesuaikan ukuran sesuai dengan yang kita inginkan. langsung aja ini dia langkah-langkahnya.
1. Login ke Blogger.
2. Pilih tata letak.
3. Klik "add widget"
4. Pilih Html/javascipt
5. lalu sobat copy paste-kan kode ini di Box "konten"
<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> <scripttype="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> Sobat bisa taruh kode banner ataupun script widget disini</center> <scripttype="text/javascript"> var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>.
Catatan : script yang berwarna biru diatas ganti dengan ukuran yang diinginkan sobat.
Catatan : taruh kode script widget sobat di teks yang berwarna hijau
7. Lalu klik "Save widget" dan selesai.
Selamat mencoba, bila ada pertanyaan comment dibawah
{ 0 komentar... Views All / Send Comment! }
Posting Komentar