Untuk cara membuatnya, mari anda ikuti langkah-langkahnya sbb:
1. Masuk ke Blogger anda, pilih Tata Letak, Edit HTML.
2. Klik tombol Select All untuk Copy kode dibawah ini, dan letakkan tepat diatas kode ]]></b:skin>
/*-- Right-Float Chatbox tutorialines.blogspot.com --*/ #TBcr{position:fixed; top:50px; z-index:+1000} * html #TBcr{position:relative} .TBcrtab{height:125px; width:30px; float:left; cursor:pointer; background:url(http://lh3.ggpht.com/_GaKwmMcf4N4/TSKIXCAopTI/AAAAAAAAD_M/2pHBa3Gzb5w/DADrchat.png) no-repeat} .TBcrcontent{float:left;border:2px solid #db4b0c; background:#000000; padding:10px} .TBcr-close{font-size:13px} .TBcr-close{color:#db4b0c} .TBcr-close a{text-decoration:none}
3. Pada Elemen Laman, Klik Tambah Gadget, Pilih HTML/JavaScript,lalu masukin kode berikut.
<!-- Float Chatbox tutorialines.blogspot.com Code Start --> <script> function showHideTBcr(){ var TBcr = document.getElementById("TBcr"); var w = TBcr.offsetWidth; TBcr.opened ? moveTBcr(0, 30-w) : moveTBcr(20-w, 0); TBcr.opened = !TBcr.opened;} function moveTBcr(x0, xf){ var TBcr = document.getElementById("TBcr"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; TBcr.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("moveTBcr("+x+", "+xf+")", 10);}} </script> <div id="TBcr"> <div class="TBcrtab" onclick="showHideTBcr()"> </div> <div class="TBcrcontent"> <center> <!-- CHATBOX ANDA DISINI --> </center> <br /> <div class="TBcr-close"> <Script type='text/javascript' src=''></Script> <span style="float:right"> <a href="javascript:showHideTBcr()"> [Tutup] </a></span></div> </div></div> <script> var TBcr = document.getElementById("TBcr"); TBcr.style.right = (30-TBcr.offsetWidth).toString() + "px"; </script> <!-- Float Chatbox http://tutorialines.blogspot.com/2012/05/cara-memasang-buku-tamu-tersembunyi.html Code End -->
4. Simpan Template anda dan selamat mencoba
Happy Blogging !