Assalamu'alaikum.Wr.WbPada kesempatan ini, kita akan membahas mengenai chat box atau kolom chat pada blogspot dan wordpress. Lihat Widget disebelah kiri blog ini, di bawah kalender. Ya, itulah chat box. Dengan memasang chat box pada blog, kita selaku pemilik blog dapat dengan mudah berkomunikasi dengan pengunjung blog kita. Selain untuk berkomunikasi dengan pengunjung, chat box juga berfungsi untuk blogwalking dengan cara meninggalkan link blog kita di chat box blog lain supaya pemilik blog bisa dengan mudah mengunjungi blog kita.
Bagaimana cara membuat chat box? simak tulisan kecil dibawah ini, cekidot!
Ada dua cara, yaitu:
Pertama:
1. Login di blog, lalu buka Rancangan.
2. Dibagian appearance klik tambah gadget.
3. Pilih widget HTML javascrippt adder
4. Pilih beberapa tipe tampilan Chat Box di bawah ini: a. Tipe Inline (default) <!-- BEGIN CBOX - www.cbox.ws - v001 --> <div id="cboxdiv" style="text-align: center; line-height: 0"> <div><iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#F6F3E0 1px solid;" id="cboxmain"></iframe></div> <div><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#F6F3E0 1px solid;border-top:0px" id="cboxform"></iframe></div> </div> <!-- END CBOX --> b. Tipe Popup Link <script type="text/javascript"> c. Tipe Floating Button <script type="text/javascript"> var cbvis = false; var cbload = false; function togglecbox () { var cbdiv = document.getElementById("cboxdiv"); var cbbut = document.getElementById("cboxbutton"); if (!cbvis) { if (!cbload) { cbdiv.innerHTML = '<iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#F6F3E0 1px solid;border-bottom:0px" id="cboxmain"></iframe><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#F6F3E0 1px solid;border-top:0px" id="cboxform"></iframe>'; cbload = true; } cbdiv.style.display = "block"; cbbut.innerHTML = "Close Cbox"; } else { cbdiv.style.display = "none"; cbbut.innerHTML = "Open Cbox"; } cbvis = !cbvis; } </script> <div id="cboxbutton" style="position: fixed; bottom: 8px; right: 16px; width: 200px; padding: 3px; text-align: center; cursor: pointer; background-color: #EDF3F7; border:#C3D7E5 1px solid;border-radius: 3px; font-family: Tahoma, sans-serif; font-size: 14px;" onclick="togglecbox()"><b>Open Cbox</b></div> <div id="cboxdiv" style="display: none; position: fixed; bottom: 48px; right: 16px; width: 200px; background: #EDF3F7; padding: 3px; line-height: 0;border:#C3D7E5 1px solid;border-radius: 3px;"></div> d. Tipe Differed Load <div id="cboxdiv" style="width: 200px; height: 380px;"></div> <script type="text/javascript"> var cbvis = false; var cbload = false; function togglecbox () { var cbdiv = document.getElementById("cboxdiv"); if (!cbvis) { if (!cbload) { cbdiv.innerHTML = '<iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#F6F3E0 1px solid;border-bottom:0px" id="cboxmain"></iframe><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#F6F3E0 1px solid;border-top:0px" id="cboxform"></iframe>'; cbload = true; } cbdiv.style.display = "block"; } else { cbdiv.style.display = "none"; } cbvis = !cbvis; } </script> <!-- move the next line to the bottom of your <body> to defer the loading of your Cbox --> <script>togglecbox();</script> 5. Paste salah satu kode di atas HTML javascrippt adder, klik simpan. Chat Box telah terpasang di blog anda. Kedua: 1. Buka situs penyedia chat box, rekomendasiku pake situs ini. 2. Daftar dulu, caranya klik sign up lalu ikuti langkah selanjutnya. 3. Setelah terdaftar, login dengan account yang baru kita buat. 4. Setelah login, pilih menu publish dibagian atas. 5. Dibagian bawah ada kolom berisi kode html, copy kode tsb lalu simpan di notepad. 6. Login di blog, lalu buka Rancangan. 7. Dibagian appearance klik tambah gadget. 8. Pilih widget HTML javascrippt adder 9. Paste kode yang tadi sudah disimpan di notepad ke HTML javascrippt adder 10. Klik preview untuk mengecek jika ada kesalahan pada kode. Jika chat box tidak muncul, berarti ada kesalahan pada kode yang kita pakai. Copy ulang kode pada situs cbox (yang tadi) untuk memperbaiki. 11. Setelah muncul chat box pada preview, klik save lalu lihat blog. Jrengg.. chat box sudah terpasang di blog. ^^ Jika ada kesulitan dalam memasang chat box bisa ditanyakan dikolom komentar,, Semoga bermanfaat ^_^
function popcbox() {
cboxwin = window.open("","Cbox","width=200,height=380,toolbar=no,scrollbars=no,status=no,resizable=yes");
cboxwin.document.write('<html><head><title>Cbox</title></head><frameset rows="*,75" frameborder="0" framespacing="0">');
cboxwin.document.write('<frame marginwidth="2" marginheight="2" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=main" noresize="true" scrolling="auto" name="cboxmain" style="border:#F6F3E0 1px solid;"/>');
cboxwin.document.write('<frame marginwidth="2" marginheight="2" src="http://www3.cbox.ws/box/?boxid=3218679&boxtag=xb97q6&sec=form" noresize="true" scrolling="no" name="cboxform" style="border:#F6F3E0 1px solid;border-top:0px"/></frameset>'); cboxwin.document.write('<noframes>Cbox needs frames!</noframes></html>');
try {
x = screen.width;
y = screen.height;
cboxwin.moveTo(Math.max((x/2)-100, 0), Math.max((y/3)-190));
} catch (e) {};
}
</script>
i likee ittt
BalasHapus