Well It is possible for Blogger Blogs also to add the Live Chat Box on the blog. There is a very nice Website for this which automates all the processes of configuring the Live Chat Box. That means you don't need to setup anything from the server side. You just require to simply copy and paste the given code to your website's source codes in order to make this check box work. So just follow the below steps in order to add the Stylish Pop Up chat box to your Blogger Blog. This Script and code can work on all the platforms but i haven't tried them yet.
So just try the below code if you have a website hosted on another providers and let us
know if it worked for you.
STEP 1 :-First of all you need to go to http://www.cbox.ws/ and here you can design your own Chat box according to you. The process of making this chat box is so simple.
STEP 2 :-After creating a form you will get a Code of that form you just need the code of it.
STEP 3 :- Simply copy the below code first :-
<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>
<script type="text/javascript">
var cbvis = false;
var cbload = false;
var cbcookie = "cboxvis=";
function togglecbox () {
var cbdiv = document.getElementById("cboxdiv");
var cbbut = document.getElementById("cboxbutton");
if (!cbvis) {
if (!cbload) {
cbdiv.innerHTML = ' <iframe frameborder="0" width="200" height="298" src="http://www4.cbox.ws/box/?boxid=4123859&boxtag=39z1wc&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain4-4123859" style="border:#9CB9FF 1px solid;" id="cboxmain4-4123859"></iframe>
<iframe frameborder="0" width="200" height="82" src="http://www4.cbox.ws/box/?boxid=4123859&boxtag=39z1wc&sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform4-4123859" style="border:#9CB9FF 1px solid;border-top:0px" id="cboxform4-4123859"></iframe>';
cbload = true;
}
cbdiv.style.display = "block";
cbbut.innerHTML = "Close Cbox";
}
else {
cbdiv.style.display = "none";
cbbut.innerHTML = "Open Cbox";
}
cbvis = !cbvis;
document.cookie = cbcookie+((cbvis)?1:0);
}
// Toggle Cbox open if it was previously
var cbcookiei = document.cookie.indexOf(cbcookie);
if (cbcookiei >= 0) {
if (document.cookie.substring(cbcookiei+cbcookie.length, cbcookiei+cbcookie.length+1) === "1") {
togglecbox();
}
}
</script>
STEP 4 :-Simply copy the above code and REPLACE the code with the RED color with the code you generated for your chat box in Step 2.
STEP 5 :-Now your code is ready. You need to paste it somewhere. So for BLOGGER. Just go to Blogger Layout and click on Add a Gadget and select HTML/JavaScript.
Now Paste the whole code in it and click on Save and that's it. You are done. Just refresh your blog and see the effect. ;) If you face any kind of problem installing this widget then feel free to comment anytime. Have Fun. :)
