Cara Membuat Widget Melayang Pada Blog

Posted: Thursday, March 8, 2012 by Ciloty BrotherHoodz Community in Labels: ,
Comments

Terutama yg akan blogtegal bahas yakni membuat widget melayang pada pengguna blogspot, manfaat dari widget melayang itu sendiri banyak, biasanya di gunakan untuk ditempati iklan berbasis PPC atau iklan yg begitu penting yg sangat terbatas waktu promosinya yang di maksudkan agar pengunjung tahu bahwa ada bisnis yang penting sekarang ini.
Widget melayang ini bisa kita atur tata letaknya entah mau d letakan sebelah kiri, kanan, atas maupun bawah pada posisi blog, nanti akan awak terangkan di bawah, hokey :d
Untuk tampilan besar kecilnya ukuran widget melayang ini tergantung pada isi yang akan kita tempatkan.
Jika widget melayang ini kita tempati iklan berbasis PPC, maka ukuran-y akan menyesuaikan dg ukuran iklan, untuk contohnya bisa di lihat pada pojok kanan atas di blogtegal.com ini.
Bagaimana apakah kamu tertarik untuk membuatnya? Jika ya mari kita lakukan penelitiannya hehehehe. . . . . .
Silahkan copi paste script di bawah ini pada widget HTML/Javascript.
Jika bingung apa itu widget HTML/Javascript silahkan ikuti petunjuknya:
  • masuk ke dasboard blog kamu.
  • pilih Rancangan
  • pada elemen halaman klik ''Tambah widget''
  • Dan pilih Widget HTML/Javascript
  • kemudian paste-kan script di bawah ini.
  • dan Simpan
<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> <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> silahkan tempatkan kode iklan atau banner atau teks atau apalah terserah kamu disini yah</center> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>
Perhatikan pada tulisan yang berwarna ungu pada script di atas, di situ berisi tentang pengaturan tentang posisi, background,border widget melayang tersebut. Atur sesuai dg keinginan kamu apakah ingin di tempatkan di bagian kiri atau kanan. Oh ya, jika kamu ingin menempatkan widget melayang tersebut pada halaman yg ingin kamu tentukan baca artikel blogtegal tentang menampilkan widget pada halaman tertentu yg kita inginkan


ads ads