Ở đây mình có khung bao,Chat With Me, auto login,nội quy,nền
Có thể nhiều người ko muốn thử nhưng nếu ai chưa có thì thử xem Hiệu quả đó
Demo:
Cả 4 cái mik nói làm rất đơn giản
Bước 1:
tạo 1 HTML với nội dung
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> xmlns="http://www.w3.org/1999/xhtml"> http-equiv="content-type" content="text/html; charset=utf-8" /><title>c3zone</title><meta http-equiv="content-script-type" content="text/javascript" /><meta http-equiv="content-style-type" content="text/css" /><link rel="stylesheet" href="/95-ltr.css" type="text/css" /><script src="http://illiweb.com/fa/js_16/vi.js" type="text/javascript"></script><script type="text/javascript">//<![CDATA[
var params = '?archives=1';var smilies_sid = '';//]]></script><script src="http://illiweb.com/fa/js/chatbox3.js" type="text/javascript"></script><style type="text/css">* {margin: 0px;padding: 0;}html, body {overflow: hidden;}body {background-color: #efefef;}</style></head><body class="chatbox" onload="CB_disconnect();ajax_refresh_chatbox('?archives=100', 1);if (location.href.indexOf('reload')==-1) location.replace(location.href+'?reload');"><div id="chatbox_header"><table cellspacing="0" cellpadding="0" border="0" width="100%"><tr><td class="catBottom" nowrap="nowrap" height="30"><table border="0" width="100%"><tr><td nowrap="nowrap"><a href="/chatbox/chatbox.forum" class="cattitle" target="chatbox"><strong>Chatbox</strong></a></td><td valign="top" class="chatbox-options"><div class="genmed" id="chatbox_main_options"><a href="javascript:void(0)" onclick="ajax_refresh_chatbox('?archives=1', 1);">Refresh</a> | <span id="chatbox_option_with_archives" style="display:none ;"><a href="/chatbox/chatbox.forum?archives=1">Archives</a> | </span><span id="chatbox_option_without_archives" style="display: ;"><a href="/chatbox/chatbox.forum?archives=0">Without archives</a> | </span><span id="chatbox_option_autorefresh" style="display: none;" onclick="refresh_chatbox('?archives=1');"><label for="refresh_auto">Auto refresh </label><input type="checkbox" name="refresh_auto" id="refresh_auto" checked="checked" style="background: transparent;" /> | </span><a href="javascript:void(0)" onclick="CB_disconnect();"><span id="chatbox_option_co" style="display: ;"><strong>Đăng Nhập</strong></span><span id="chatbox_option_disco" style="display: none;">Thoát</span></a> </div></td></tr></table></td></tr></table></div><div id="chatbox_members" curpos="0" maxpos="460" pageincrement="144" increment="10"></div><div id="chatbox"></div><div id="chatbox_footer" style="display: none;"><div id="chatbox_messenger"><form name="post" action="/chatbox/chatbox.forum" method="post" onsubmit="submitmsg('?archives=1');refresh_chatbox('?archives=1');return false;"><table width="100%" cellspacing="0" cellpadding="0"><tr><td class="catBottom"><div id="chatbox_messenger_form"><table cellspacing="0" cellpadding="0" height="24" width="100%" class="chatfootertable"><tr><td width="100%" align="right"><table cellspacing="2" cellpadding="0" border="0" style="line-height: 0px;" class="text-styles" ><tr><td><div id="divbold" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className=( document.post.sbold.value == '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'" onclick="do_style('bold');" onmousedown="this.className='fontbutton fontbutton_clicked';" onmouseup="this.className=( document.post.sbold.value != '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'"><img src="http://2img.net/i/fa/subsilver/wysiwyg/bold.gif" width="21" height="20" alt="Bold" title="Bold" /></div></td><td><div id="divitalic" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className=( document.post.sitalic.value == '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'" onclick="do_style('italic');" onmousedown="this.className='fontbutton fontbutton_clicked';" onmouseup="this.className=( document.post.sitalic.value != '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'"><img src="http://2img.net/i/fa/subsilver/wysiwyg/italic.gif" width="21" height="20" alt="Ital." title="Ital." /></div></td><td><div id="divunderline" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className=( document.post.sunderline.value == '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'" onclick="do_style('underline');" onmousedown="this.className='fontbutton fontbutton_clicked';" onmouseup="this.className=( document.post.sunderline.value != '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'"><img src="http://2img.net/i/fa/subsilver/wysiwyg/underline.gif" width="21" height="20" alt="Underl." title="Underl." /></div></td><td><div id="divstrike" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className=( document.post.sstrike.value == '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'" onclick="do_style('strike');" onmousedown="this.className='fontbutton fontbutton_clicked';" onmouseup="this.className=( document.post.sstrike.value != '1' ) ? 'fontbutton fontbutton_selected' : 'fontbutton fontbutton_normal'"><img src="http://2img.net/i/fa/subsilver/wysiwyg/strike.gif" width="21" height="20" alt="Strike" title="Strike" /></div></td><td width="10"> </td><td><div id="divcolor" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className='fontbutton fontbutton_normal'" onclick="do_selectcolor(event);"><img src="http://2img.net/i/fa/subsilver/wysiwyg/color.gif" width="21" height="16" alt="Màu font" title="Màu font" /><img src="http://2img.net/i/fa/subsilver/wysiwyg/menupop.gif" width="11" height="16" alt="Màu font" title="Màu font" />
<img src="http://2img.net/i/fa/subsilver/wysiwyg/clear.gif" id="show_color" alt="Màu font" title="Màu font" width="21" height="4" /></div></td><td><div id="divsmilies" class="fontbutton fontbutton_normal" onmouseover="this.className='fontbutton fontbutton_hover'" onmouseout="this.className='fontbutton fontbutton_normal'" onclick="do_selectsmilies(event);"><img src="http://2img.net/i/fa/subsilver/wysiwyg/smilie.gif" width="21" height="20" alt="Biểu tượng" title="Biểu tượng" /><img src="http://2img.net/i/fa/subsilver/wysiwyg/menupop.gif" width="11" height="20" alt="Biểu tượng" title="Biểu tượng" /></div></td><td width="10"> </td><td><input type="hidden" name="sbold" value="0"><input type="hidden" name="sitalic" value="0"><input type="hidden" name="sunderline" value="0"><input type="hidden" name="sstrike" value="0"><input type="hidden" name="scolor" id="scolor" value="#000000"><span class="gen" onclick="document.post.message.focus();"><label>Thông điệp : <input type="text" id="message" name="message" size="35" maxlength="1024" class="post" autocomplete="off" onkeydown="number_of_refresh=0;" /></label> <input type="hidden" name="sent" value="" /><input type="submit" name="submit_button" value="Send" id="submit_button" /> </span></td></tr></table></td></tr></table></div></td></tr></table></form></div></div><script type="text/javascript">//<![CDATA[
function CB_disconnect(){if ( connected ){ajax_connect('?archives=0', 'disconnect');clearInterval(refresh_interval);}else{ajax_connect('?archives=1', 'connect');try {refresh_interval = setInterval("refresh_chatbox('?archives=1')", 5000);} catch (err) {}}}if ( document.location.href.indexOf('chatbox', 1) == -1 ){$('#divcolor').css('display', '');$('#divsmilies').css('display', '');}var connected = false;var chatbox_updated = 1260633294;var chatbox_last_update = 1260633294;var template_color = '#000000';var refresh_interval;window.setTimeout("document.getElementById('chatbox').scrollTop = 999999; Init_pref();", 200);window.setTimeout("document.getElementById('chatbox').scrollTop = 999999;", 1000);if ( connected ){try {refresh_interval = setInterval("refresh_chatbox('?archives=1')", 5000);} catch (err) {}}else{try {refresh_chatbox('?archives=1');} catch (err) { }}//]]></script></body></html>
Vào trang chủ Tn
cóp Code này vào nhé và sửa lại cái link HTML mà bạn vừa tạo thay cho cái trang HTML của mình ở phần iframe
- Code:
<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center"><div class="tcathl" align="center"><div class="tcathl_left"><div class="tcathl_01"><div class="tcathl_02"><div class="tcathl_03"><div class="tcathl_text" style="padding: 40px 45px 0px 45px;">
<center>Chat with me</center></div></div></div></div>
</div><div class="tcathl_right"><div class="tcathl_04"> <div class="tcathl_05">
</div></div>
</div>
</div>
</table><div class="hailang_left"><div class="hailang_right"><div class="hailang_center"><div><input src="http://i869.photobucket.com/albums/ab259/tuyetson_10/Skin%20hailang/collapse_thead.gif" style="float: right; margin-top: -75px; margin-right: -10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = '';this.src = 'http://i869.photobucket.com/albums/ab259/tuyetson_10/Skin%20hailang/collapse_thead.gif'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.src = 'http://i869.photobucket.com/albums/ab259/tuyetson_10/Skin%20hailang/collapse_thead.gif'; }" type="image" align="center"></div><div style="margin: 0px; padding: 0px; min-height: 0px; max-width: 880px; background-color: transparent;"><div style="" align="center">
<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center">
<iframe name="fcb_frame" src="http://sinhviena1.lovelyforum.net/h3-page" frameborder="0" style="width: 100%; height: 280px;"></iframe>
</table></div></div>
</div>
</div>
</div>
<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center"><div align="center"><div class="bottom_center"><div class="bottom_left"><div class="bottom_right">
</div></div></div></div>
</table>
- Code:
/* Chatbox */
body.chatbox {
min-width: 550px !important;
background-image: none;
padding: 0;
margin: 0;
background-color: #fffffff;
background-image: url(http://img39.imageshack.us/img39/3092/master16372205.gif);
}
#chatbox_members {position: absolute;top: 30px;bottom: 30px;width: 180px;overflow: auto;border-right: 1px solid ;}#chatbox {position: absolute;top: 30px;left: 181px;right: 0;bottom: 30px;overflow: auto;line-height: 10px;}.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {font-size: 12px;}.chatbox-options {text-align:right;}
#chatbox_messenger_form .gen,#chatbox_messenger_form .text-field,#chatbox_messenger_form {float:right;}#chatbox_footer {position: absolute;bottom: 0;left: 0;right: 0;height: 30px;}#chatbox_footer table.text-styles {float: right;}#chatbox_footer .text-field {float: left;}#chatbox_header {height: 30px;background-color: #ffffff;}
#chatbox p {line-height: 1.2em;}
.chatbox_row_1 {padding: 4px;background: transparent;}.chatbox_row_2 {padding: 4px;background: transparent;}.chatbox_row_3 {padding: 4px;background: transparent;}.memberlist_row_1 {padding: 2px 2px 2px 10px;background-color: #efefef;}
#chatbox_members .member-title {text-align: center;padding: 0.5em 0.25em;background-image: none;font-size: 12px;background-color: transparent;color : #0033CC;font-family: Verdana,Arial,Helvetica,sans-serif;}#chatbox_members ul {list-style: none;margin: 0 0 0 10px;}#chatbox_members ul li {margin: 2px 2px 2px 0;}#message,#submit_button{border-width: 1px;}.fontbutton {padding: 1px;cursor: pointer;text-align: left;}.fontbutton_normal {background: #E1E1E2;}.fontbutton_selected {background: #BBC7CE;border: 1px solid #22229C;}.fontbutton_clicked {background: #959595;border: 1px solid #22229C;}.fontbutton_hover {background: #E1E1E2;border: 1px solid #22229C;}#chatbox .user {font-weight: bold;}div#chatbox {color: #000000;}#chatbox_contextmenu { background-color: #ffffff; border:1px solid #aaa;}#chatbox_contextmenu p {margin:0; padding: 1px 4px;font-family: verdana, arial, sans-serif;background: #;border-bottom:1px solid #777; }#chatbox_contextmenu p.hover { background: #; }#chatbox_contextmenu p.close {background: #ddd; padding: 1px; font-size: 70%; color:#fff; background: url(''); }#chatbox_contextmenu p.close img { vertical-align: middle; padding-left: 20px;}#chatbox_contextmenu a { color: #; text-decoration: none; font-size: 70%;}#chatbox_contextmenu a:hover { color: #; }.fontbutton{border:0;}* html #chatbox-members { /* IE expressions helping IE work in Standards mode */height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");}* html #chatbox { /* IE expressions helping IE work in Standards mode */height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 10) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 1) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 1.3) ) + "px");}
/* End Edit did */
/*Internet Explorer fixers and hacks for Chatbox *
/* html #chatbox-members {
/* IE expressions helping IE work in Standards mode */
height:
expression(( document.documentElement.clientHeight ?
document.documentElement.clientHeight : document.body.clientHeight) - (
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) +
"px");
}
* html #chatbox {
/* IE expressions helping IE work in Standards mode */
height:
expression(( document.documentElement.clientHeight ?
document.documentElement.clientHeight : document.body.clientHeight) - (
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) +
"px");
width: expression(( document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body.clientWidth) - (
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 10) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 1) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 1.3) )
+ "px");
}
* html #chatbox-footer {
/* IE expressions helping IE work in Standards mode */
width:
expression(( document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body.clientWidth) - (
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) +
(parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) +
"px");
}
Chatbox
Các bạn đổi cái CHATBOX trong strong bằng cái bạn cần muốn đổi như là nội quy..
Các bạn bấm Chấp nhận
Hết 3 bước này > Thành Quả