demo:
Thêm 1 js
In the home page

Code:


$(document).ready(function(){var sHtml='<iframe onload="setOptions()" src="/chatbox/index.forum?archives=1" id="frame_chatbox" scrolling="yes" width="100%" height="100%" type="text/html" style="border: 0px;" />';$('#frame_chatbox').replaceWith(sHtml)});var old='',oChat=null,connected=1,chatbox_updated=0,chatbox_last_update=1,template_color='#333333',chatbox_messages='null',chatbox_messages_old='',number_of_refresh=0,refresh_interval=0,ncheckData=0;function setOptions(){oChat=$('#frame_chatbox').contents();oChat.find('#chatbox_footer form').attr('onsubmit',"parent.submitmsg2('?archives=1');parent.refresh_chatbox2('?archives=1');return false;");oChat.find('#chatbox_main_options li:eq(0) a').attr('onclick',"parent.ajax_refresh_chatbox2('?archives=1', 1);");oChat.find('#chatbox_main_options li:eq(3)').attr('onclick',"parent.refresh_chatbox2('?archives=1');");oChat.find('#chatbox_main_options li:eq(4) a').attr('onclick',"parent.CB_disconnect2();");connected=document.getElementById('frame_chatbox').contentWindow['connected'];chatbox_updated=document.getElementById('frame_chatbox').contentWindow['chatbox_updated'];chatbox_last_update=document.getElementById('frame_chatbox').contentWindow['chatbox_last_update'];number_of_refresh=document.getElementById('frame_chatbox').contentWindow['number_of_refresh'];ncheckData=setInterval("checkData()",10)}function checkData(){if(oChat.find('#chatbox span.user').length){clearInterval(ncheckData);try{connected=document.getElementById('frame_chatbox').contentWindow['connected'];document.getElementById('frame_chatbox').contentWindow.clearInterval(document.getElementById('frame_chatbox').contentWindow['refresh_interval']);chatAvatar();refresh_interval=setInterval("refresh_chatbox2('?archives=1')",5000);oChat[0].getElementById('chatbox').scrollTop=999999}catch(err){}}}function chatAvatar(){var target=oChat.find('#chatbox span.user a'),chk={};target.each(function(index){var oThis=$(this);var USER_URL=oThis.attr('href');if(!chk[USER_URL]){chk[USER_URL]=true;var oStor=sessionStorage.getItem('chat'+USER_URL);if(oStor!==null){oChat.find("#chatbox span.user a[href='"+USER_URL+"']").parent().prepend('<img alt="" class="xuanquyavatarchatbox" src="'+oStor+'">')}else{$.get(USER_URL,function(data){var AVATAR=$('#profile-advanced-right img',data).attr('src');if(!AVATAR)AVATAR=$('#profile_tabs p img',data).attr('src');oChat.find("#chatbox span.user a[href='"+USER_URL+"']").parent().prepend('<img alt="" class="xuanquyavatarchatbox" src="'+AVATAR+'">');sessionStorage.setItem('chat'+USER_URL,AVATAR)})}}})}function CB_disconnect2(){if(connected){document.getElementById('frame_chatbox').contentWindow.ajax_connect('?archives=1','disconnect');clearInterval(refresh_interval);clearInterval(ncheckData);connected=0}else{document.getElementById('frame_chatbox').contentWindow.ajax_connect('?archives=1','connect');clearInterval(refresh_interval);document.getElementById('frame_chatbox').contentWindow.clearInterval(document.getElementById('frame_chatbox').contentWindow['refresh_interval']);connected=1;number_of_refresh=0;if(!ncheckData)ncheckData=setInterval("checkData()",10)}}function submitmsg2(params){oChat[0].post.sent.value=oChat[0].post.message.value;oChat[0].post.message.value='';oChat[0].post.message.focus();ajax_submit_chatbox2(params);return false}function refresh_chatbox2(params){if(params==''||params==undefined){params='?achives=0'}if(oChat[0].getElementById('refresh_auto').checked==true){ajax_refresh_chatbox2(params)}$.post('/chatbox/chatbox_actions.forum?archives=1','mode=send&sent=')}function ajax_refresh_chatbox2(params,force){if(params==''||params==undefined){params='?achives=0'}if(window.XMLHttpRequest){var http_request=new XMLHttpRequest()}else if(window.ActiveXObject){var http_request=new ActiveXObject("Microsoft.XMLHTTP")}http_request.onreadystatechange=function(){if(http_request.readyState==4&&http_request.status==200){var parsed_text=http_request.responseText;eval(parsed_text);if(chatbox_last_update>chatbox_updated||force){if(oChat[0].getElementById('chatbox').innerHTML!=null){if(chatbox_messages_old!=chatbox_messages){oChat[0].getElementById('chatbox').innerHTML=chatbox_messages;chatbox_messages_old=chatbox_messages;chatAvatar();oChat[0].getElementById('chatbox').scrollTop=oChat[0].getElementById('chatbox').scrollHeight+oChat[0].getElementById('chatbox').offsetHeight;oChat[0].getElementById('chatbox').scrollTop=999999}}if(oChat[0].getElementById('chatbox_members').innerHTML!=null)oChat[0].getElementById('chatbox_members').innerHTML=chatbox_memberlist;chatbox_updated=chatbox_last_update}}};http_request.open('GET','/chatbox/chatbox_actions.forum'+params+'&mode=refresh',true);http_request.send(null)}function ajax_submit_chatbox2(params){number_of_refresh=0;var msg_sent=oChat[0].post.sent.value;if(params==''||params==undefined){params='?achives=0'}var data='&mode=send';data+='&sent='+encodeURIComponent(msg_sent);data+='&sbold='+oChat[0].post.sbold.value;data+='&sitalic='+oChat[0].post.sitalic.value;data+='&sunderline='+oChat[0].post.sunderline.value;data+='&sstrike='+oChat[0].post.sstrike.value;data+='&scolor='+oChat[0].post.scolor.value;if((msg_sent.indexOf('/away')==0)||(msg_sent.indexOf('/abs')==0)){oChat[0].getElementById('refresh_auto').checked=false}if(oChat[0].post.sent.value=='/banlist'){window.open('/chatbox/chatbox_banlist.forum'+params,'banlist','toolbar=no,menubar=no,personalbar=no,width=450,height=300,scrollbars=yes,resizable=yes');return false}if(window.XMLHttpRequest){var http_request=new XMLHttpRequest()}else if(window.ActiveXObject){var http_request=new ActiveXObject("Microsoft.XMLHTTP")}http_request.onreadystatechange=function(){if(http_request.readyState==4&&http_request.status==200){var parsed_text=http_request.responseText;eval(parsed_text);if(chatbox_last_update>chatbox_updated){oChat[0].getElementById('chatbox').innerHTML=chatbox_messages;oChat[0].getElementById('chatbox_members').innerHTML=chatbox_memberlist;chatbox_updated=chatbox_last_update;chatAvatar();oChat[0].getElementById('chatbox').scrollTop=999999}}};http_request.open('POST','/chatbox/chatbox_actions.forum'+params,true);http_request.setRequestHeader('Content-Type','application/x-www-form-urlencoded;');http_request.send((data))}

vào css bỏ em này vào !

Code:

#chatbox span[title] {
color: #8f8f8f!important;
float: right!important;
}
#chatbox p .user + .msg {
display: block;
margin-top: 3px;
}
#chatbox p {
line-height: 1.2em;
height: 35px;
}
.xuanquyavatarchatbox{
background: #fff;
border: 1px solid #ddd;
display: block;
float: left;
height: 30px;
margin-right: 5px;
padding: 1px;
vertical-align: middle;
width: 30px;
}

bỏ em này vào inde_body nơi cần hiện !

Code:



<!-- BEGIN switch_user_logged_in -->

<div class="main"><div class="main-content chatbox clearfix"><div id="chatbox_top" style="overflow:none;height:300px;"></div>
<script type="text/javascript">insertChatBoxNew('chatbox_top', '/chatbox/index.forum?page=front&');</script><div style="resize"><img src="http://2img.net/i/fa/resize.gif" onmousedown="javascript:resizeElement(event, 'chatbox_top');" alt="" style="cursor:se-resize; float: right;" /></div></div>

</div>
    <!-- END switch_user_logged_in -->