Cara Membuat Buku Tamu Melayang di Sisi Kiri Blog

TULISKAN.com - Buku Tamu atau Guest book adalah suatu widet yang berfungsi untuk berinteraksi antar sesama pengunjung, jadi dengan guest book ini kita dapat sekedar meninggalkan jejak ataupun memberi kalimat sapaan kepada semua anggota didalamnya. Dengan widget ini, tentunya blog kita akan semakin terlihat hidup dan bersahabat, karena semua pengunjung bisa bersilaturahi dan mengikat tali persaudaraan.

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/AVvXsEg6MmGHTydGw8_X45Bl-IdD50fenpZNh5gW6H03buVeDPScWM_FnOfkhsLZgNEvhRpo5ZatabG0PYpTJvDNRCgh_KVEybup3HdOeGuAXByvTClSiy8ixvkyedouWJkO_eFVpMSmiPQ8ucyu/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.

Postingan terkait:

— —