Cara Membuat Buku Tamu / ChatBox Di Blog

Cara Membuat Buku Tamu / ChatBox Di Blogspot - Assalamualaikum Wr. Wb. Kali ini Cara Rosyid akan mengajarkan kepada sobat tentang cara membuat kotak pesan/buku tamu untuk chatingan dengan menggunakan CBOX. Membuat atau memasang buku tamu atau guestbook yang melayang di sisi kanan blog merupakan hal yang sangat menyenangkan untuk dilakukan karena selain dapat memperindah atau mempercantik tampilan blog. Dengan membuat buku tamu akan memberikan fitur yang menyenangkan dan sangat berguna untuk mempererat hubungan para blogger dengan blogger lain atau dengan pengunjung blog mereka.. Dengan membuat kotak pesan/buku tamu ini tentunya blog sobat semakin cantik tampilannya. Guestbook atau buku tamu merupakan salah satu dari kumpulan widget terbaik untuk blog karena widget tersebut cukup populer dikalangan para bloggger. saya akan memberikan cara membuat atau memasang buku tamu di blog blogger atau blogspot anda dengan langkah yang mudah dan cepat untuk dilakukan. Tentu sangat mudah untuk membuat kotak pesan/buku tamu ini. Ikuti saja langkah-langkah yang ada di bawah ini.

1. Langkah pertama anda harus mempunyai CBOX. Jika anda belum punya silahkan baca dulu artikel Cara Membuat CBOX 

2. Kemudian logg in ke Blogger sobat

3. Seperti biasanya ~>> masuk ke Tata Letak

4. Klik Tambahkan Gadget ~>> pilih HTML/JavaScript

5. Setelah itu copy script yang ada di bawah ini

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}

.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1108.photobucket.com/albums/h405/christian410/ghtrf.png') no-repeat;
}

.gbcontent {
float:left;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-radius-bottomleft:5px;
-o-border-radius-bottomleft:5px;
-khtml-border-radius-bottomleft:5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-topleft: 5px;
background: #F2F2F2; url() no-repeat bottom;
padding:10px;
}

</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){

var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 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+")", 5);}
}</script>

<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>

<div class="gbcontent">
<center>

Kode CBOX Anda masukkan disini

<br />
<div style="text-align:center">
<span style="float:right; color:#000000;"><a target="_blank" href="http://cara-rosyid.blogspot.co.id/2015/12/cara-membuat-buku-tamu-di-blog.html"> Get this widget! </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>

</div>

6. Paste script yang telah dicopy tadi kedalam kotak yang disediakan dan judulnya biarkan kosong
7. Ganti tulisan yang berwarna biru dengan kode CBOX sobat yang telah anda buat
8. Langkah terakhir Klik simpan

Keterangan : tulisan yang berwarna merah adalah gambar yang akan muncul di tampilan.. anda bisa menggantinya dengan cara ganti link tersebut... saya sudah menyediakan macam macam gambarnya dengan lengkap :D Hehe
langsung saja klik link web saya ini lalu pilih gambar yang anda sukai kemudian copy link nya dan pastekan di tulisan merah yang ada di script di atas. . .
~>> http://ro-syid.site.bz/cara-rosyid/buku-tamu.html

Selesai sudah cara buat Buku Tamu / Chat Box... Mudah kan,,? Ok saya kira langkah diatas cukup mudah, namun jika masih ada pertanyaan, silahkan isi kotak komentar dibawah untuk mengajukan pertanyaan atau langsung menghubungi saya di Contact. Semoga artikel kali ini dapat bermanfaat. Baca juga artikel terkait lainnya di bawah ini ya

Wassalamualaikum Wr.Wb