Cara Membuat Chatbox Sembunyi Pada Blog

Banyak sekali fasilitas dapat Anda gunakan untuk jenis buku tamu ini sekarang Saya akan bagikan tipsnya Buat Buku Tamu Sembunyi Pada Blog ShoutMix. Sebelum itu harus dipikirkan tampilan dari chatbox itu sendiri agar mempermudah penerapannya Saya akan kasih solusi termudah dengan memberikan tutorial, karna di sini Anda bisa memilih tampilannya sesuai keinginan dan kebutuhan blog Anda. Dari warna teks, link background dan lain sebagainya. Ikuti langkah demi langkah sebagai berikut.

1. Daftar ShoutMix untuk mendapatkan Account Anda.

2. Pilih Create Shout Box

3. Lengkapi formulir pendaftarannya lalu klik continue

4. Setting ShoutMix sesuai dengan kebutuhan Anda, yang terpenting dalam pengaturan ShoutMix yang utama adalah Setting Display ->> Labels ShoutMix, lengkapi label dan Setting Security ->> Website Lock isi dengan alamat Url blog Anda, selanjutnya sesuaikan pengaturan dengan kebutuhan Anda seperti, warna teks, link form dan lain-lain Lihat gambar di bawah ini

5. Setiap selesai melakukan pengaturan jangan lupa untuk di simpan, setelah melengkapi default setting seperti di atas login terlebih dahulu pada Form Display ShoutMix untuk melihat hasilnya, lihat gambar di bawah ini

6. Untuk mendapatkan kodenya lihat Quick Start ->> Get Codes, lihat gambar di bawah ini, klik gambar untuk lebih jelas.

7. Selanjutnya Masuk Blogger.com8. Pilih Rancangan ->> Element Laman ->> tambahkan
Gadget HTML/ JavaSrcipt, masukkan kode di bawah ini.

<script type="text/javascript">
function showHidechat(){
var chat = document.getElementById("chat");
var w = chat.offsetWidth;
chat.opened ? movechat(0, 30-w) : movechat(20-w, 0);
chat.opened = !chat.opened;
}
function movechat(x0, xf){
var chat = document.getElementById("chat");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
chat.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movechat("+x+", "+xf+")", 10);}
}
</script>
<div id="chat">
<div class="chat-click" onclick="showHidechat()"> </div>
<div class="chatbox">
<center>

kode tampilan chatbox letakan disini

</center>
<a href="http://www.berbagi-kreativitas.blogspot.co.cc" title="Pasang widget chatting seperti ini di blog anda" target="_blank">[+]</a>
<span style="float:right">
<a href="javascript:showHidechat()">
[x]
</a></span>
</div></div>

<script>
var chat = document.getElementById("chat");
chat.style.right = (30-chat.offsetWidth).toString() + "px";
</script>

9. Sekarang tinggal menambahkan kode dari ShoutMix milik Anda yang telah di dapat, letakkan di antara kode di atas, perhatikan dan letakkan kode pada Teks yang bercetakkan Tebal di atas "kode tampilan chatbox letakan disini".

10. Simpan Gadget.

Peringatan : Jangan coba anda lihat hasilnya pada Gadget HTML/ JavaSrcipt dengan menekan atau klik rich text, berdasarkan pengalaman pribadi itu akan membawa dampak kegagalan Tips di atas. OK.! Selamat mencoba dan semoga sukses.

Buku Tamu Ini Sekarang Tidak Gratis Lagi

Gratis Buat Disini