Kali ini saya ingin berbagi script dengan agan2 semua tentang cara membuat buku tamu melayang, hehehe... Okeh langsung saja buat yang ingin membuat buku tamu melayang dapat meng-copas script berikut. Adapun langkah-langkahnya yaitu sebagai berikut :
1. Login dahulu ke blogspot.com (pakai akun Anda tentunya)
2. Pilih Design
3. Pilih Add a Widget
4. Pilih HTML / Java Script
5. Lakukan peng-copi-an script berikut :
<style type="text/css"> #gb{ position:fixed; top:50px; z-index:+1000; } * html #gb{position:relative;} .gbtab{ height:100px; width:30px; float:left; cursor:pointer; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi06K-Z78T8n0qqoeUrqeSgp7HU4eMi2aaLXyEnnlOMh6wufr4vR33hjvMhHCogw8cUs-KoC6JiQcySBwmUSkVfXlv67FvN3Oaifk0QoSgDh5l6ApPQ6KHmERBO9RiCofoGD07b6lfsnt-Z/') no-repeat; } .gbcontent{ float:left; border:2px solid #A5BD51; background:#F5F5F5; 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.right = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id="gb"> <div class="gbtab" onclick="showHideGB()"> </div> <div class="gbcontent"> LETAKKAN SCRIPT ANDA DISINI <br/> Pengin Buku Tamu ANDA seperti ini?<br/> <a href="http://forum-buku.blogspot.com"> Klik disini </a> <div style="text-align:right"> <a href="javascript:showHideGB()"> [tutup] </a> </div> </div> </div> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.right = (30-gb.offsetWidth).toString() + "px"; </script>
6. Gantilah tulisan LETAKAN SCRIPT ANDA DISINI dengan script yang sudah anda dapatkan dari shoutmix chat widget.
7. Save
8. Lihatlah hasilnya
Contoh Hasilnya ada disini
Alhamdulillah, udah selesai bikin buku tamu melayang, kini tampilan blog lebih menarik dan lebih memudahkan para pengunjung untuk berkomentar... hehehe
Wassalamu'alaikum Wr. Wb.
No comments:
Post a Comment