Untuk semakin mempererat hubungan kita dengan para pengunjung, kita juga bisa memasang widget ini di blog, tepatnya melayang di sisi kiri blog, agar tidak memakan tempat dan lebih terlihat oleh para visitor. Baik, berikut ini adalah Cara Membuat Buku Tamu Melayang di Sisi Kiri Blog, silahkan disimak dengan seksama.
Cara Membuat Buku Tamu Melayang di Sisi Kiri Blog
1. Login ke Blogger.
2. Pilih Tata Letak
3. Pilih "Add Gadget"
4. Pilih Gadget "HTML/JavaScript".
5. Setelah itu Letakkan kode dibawah ini kedalam box "konten".
<!-- left hidden chatbox by www.tuliskan.com START -->
<style> #hcl { position:fixed; top:135px; left:20px; z-index:+500; } * html #hcl {position:relative;} .hcltab { height:200px; width:30px; float:left; cursor:pointer; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdqtpIe-ypQtFy0LXb4CN451ghwAcnrLlQmbJczHgI7H-VjGwMwGfJ2OFfk5BKIA5m87ASxTJRAEE5dKnjVjMq6vBwGV_T-6hg4XN4GE-tUCEzR4q6Yr6n4WpYPm0KY49Z7Vsim0dFEKMC/s1600/buku-4.png') no-repeat; } .hclcontent { float:left; border:4px solid #5F9EA0; background:#F5F5F5; padding:3px; } .hc-credit {font-size:9px}
.hc-credit a {text-decoration:none} </style> <script type="text/javascript"> function showHidehcl(){ var hcl = document.getElementById("hcl"); var w = hcl.offsetWidth; hcl.opened ? movehcl(0, 30-w) : movehcl(20-w, 0); hcl.opened = !hcl.opened; } function movehcl(x0, xf){ var hcl = document.getElementById("hcl"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; hcl.style.left = x.toString() + "px"; if(x0!=xf){setTimeout("movehcl("+x+", "+xf+")", 10);} } </script> <div id="hcl"> <div class="hclcontent">
<-------------isikan dengan HTML Chat Box/Buku tamu anda-------------->
<div style="text-align: right; font-size: 10px;">
Widget by
<a href="http://www.tuliskan.com">
Farhan Share
</a>
</div>
<br /> <div class="hc-credit"> <span style="float:left"> <!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE --> </span> <span style="float:right"> <a href="javascript:showHidehcl()"> </a> </span> </div> </div> <div class="hcltab" onclick="showHidehcl()"> </div> <script type="text/javascript"> var hcl = document.getElementById("hcl"); hcl.style.left = (30-hcl.offsetWidth).toString() + "px"; </script> <!-- left hidden chatbox by www.tuliskan.com END --></div>
Keterangan : tulisan yang berwarna merah ganti dengan kode HTML chat box/buku tamu anda.
Penting! : cara mendapatkan HTML buku tamu anda bisa masuk ke www.cbox.ws, registrasi, lalu design buku tamu/chat box anda, dan copy code HTML-nya, lalu ganti tulisan yang berwarna merah pada kode HTML diatas menjadi HTML yang anda dapatkan dari www.cbox.ws tadi.
6. Klik "Save" dan selesai.
Demikian informasi terbaru seputar tutorial dan tips trik blog tentan Cara Membuat Buku Tamu Melayang di Sisi Kiri Blog, semoga bermanfaat, dan selamat mencoba.
EmoticonEmoticon