Membuat Buku Tamu Seperti Obrolan Facebook di Blog

Facebook merupakan jejaring sosial yang ngtren dan populer diminati orang, bahkan ada temen yang bilang Gak ada facebook gak rame... (mangnya sponsor apa?)... hahahaha. Pada tutorial kali ini akan dibahas tentang membuat shoutmix atau cbox seperti jejaring sosial facebook.

Kalau melihat pada kata-kata diatas tentunya kan membuat penasaran anda, bisakah membuat obrolan seperti facebook. Kang Onk bilang sangatlah bisa. Sebenarnya postingan kali ini sudah pernah dibahas pada tutorial Cara Membuat Buku Tamu sebelumnya, akan tetapi ini berbeda. Anda bisa liat di cbox milik saya, lagi-lagi tutorial ini berbeda. Ya, seperti obrolan pada facebook githu....

Masih penasaran? ikuti langkahnya sebagai berikut :

• Masuk ke akun Blogger Anda;


• Klik tombol Rancangan dan pilih Edit HTML;


• Cari kode ]]></b:skin>;


• Jika ketemu copy paste kode dibawah ini persis diatas kode ]]></b:skin>

#kodfacebook { position:fixed; right:15px; bottom:0px; width:462px; float: right; }
#kodbukutamu a{ color:#fff; text-align:left; width:450px; padding:5px; display:block;background:#6d86b7; }
#kodobrolan a:hover{ background:#FAFBFB; outline:none; }
#kodobrolan a{ outline:none; border:1px solid #ccc; text-align:left; width:180px; padding:5px; display:block; background:#EDEFF0; float: right; }

• Langkah selanjutnya cari </body> taruh kode berikut di atas </body>

<script type='text/javascript'>
function showElement(layer){var myLayer = document.getElementById(layer);if(myLayer.style.display==&quot;none&quot;){myLayer.style.display=&quot;block&quot;;myLayer.backgroundPosition=&quot;top&quot;;} else { myLayer.style.display=&quot;none&quot;;    }}
</script>
<div id='kodfacebook'>
<div id='vcxz' style='display:none; border:1px solid #999; background-color:#FFF;'>
<div id='kodbukutamu'>
<a href='#bottom' onclick='javascript:showElement(&quot;vcxz&quot;)'><b>Buku Tamu</b></a>
</div>
<iframe frameborder='0' height='350' scrolling='auto' src='link buku tamu anda' width='100%'/>
</div>
<div id='kodobrolan'>
<a href='#bottom' onclick='javascript:showElement(&quot;vcxz&quot;)'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjax3kip4wQNvbQezy_QWdSctgqBUvEZ1QNhOUxV9XEv0bhOGNNgzvGxN50P8BhsaQDMM3-TYSi_lO90MXwU0PXgJNkvlUpesg1A-w3s7tSAx7HUTugM__I5HBngjZfd9fe23BHhYrjji8/s1600/c.gif'/><b>Obrolan</b></a>
</div>
</div>

* Ganti huruf yang berwarna biru dengan link buku tamu anda
Simpan Template.

Selamat mencoba dan semoga sukses....