Giới thiệu

Hướng dẫn:

Tạo trang HTML (Administration Panel → Modules →Html & Javascript Management  → Html Management)

Title: Login Forum
Do you wish to use your forum header and footer ? YES
Use this page as homepage ? No

Code:

<br /> <script>$(document).ready(function() {
if (location.pathname !== '/') {
$('#right').css('height','0px');
$('#content').css('margin-right','0px');
}
});</script>

<title>Sign In - Social Academy Forum</title>

<div class="clearfix" id="login_form">
<div id="member_login">
<h2 class="maintitle">Sign In</h2>
<form id="login" action="/login.forum" method="post">
<div id="regular_signin">
<a id="_regularsignin"></a>
<h3 class="bar">Enter your sign in name and password</h3>
<ul class="ipsForm ipsForm_vertical ipsPad_double left">
<li class="ipsField">
<label class="ipsField_title" for="ips_username">Username or email:</label>
<p class="ipsField_content">
<input id="ips_username" class="input_text" name="username" size="30" tabindex="0" type="text"><br>
<span class="desc ipsType_smaller">Need an account? <a title="Register now!" href="/register">Register now!</a></span>
</p>
</li>
<li class="ipsField">
<label class="ipsField_title" for="ips_password">Password</label>
<p class="ipsField_content">
<input id="ips_password" class="input_text" name="password" size="30" tabindex="0" type="password"><br>
<a title="Retrieve password" class="ipsType_smaller" href="/profile?mode=sendpassword">I've forgotten my password</a>
</p>
</li>
</ul>
<div id="other_signin" class="right ipsPad_double">
<ul class="ipsList_data clear ipsType_small">
</ul>
</div>
</div>
 
<hr>
<fieldset id="signin_options">
<legend>Sign in options</legend>
<ul class="ipsForm ipsForm_vertical ipsPad_double">
<li class="ipsField ipsField_checkbox clearfix">
<input type="checkbox" tabindex="3" class="input_check" value="1" name="rememberMe" checked="checked" id="remember">
<p class="ipsField_content">
<label for="remember">Remember me</label><br>
<span class="desc lighter">This is not recommended for shared computers</span>
</p>
</li>
 
<li class="ipsField ipsField_checkbox clearfix">
<input type="checkbox" tabindex="4" class="input_check" value="1" name="anonymous" id="invisible">
<p class="ipsField_content">
<label for="invisible">Sign in anonymously</label><br>
<span class="desc lighter">Don't add me to the active users list</span>
</p>
</li>
 
<li class="ipsPad_top ipsForm_center desc ipsType_smaller">
<a href="/tos" rel="nofollow">Privacy Policy</a>
</li>
 
</ul>
</fieldset>
<fieldset class="submit">
                          
<input class="ipsButton" name="login" value="Sign In" tabindex="0" type="submit">
<input name="redirect" type="hidden" value="" />   or <a class="cancel" title="Cancel" href="/forum">Cancel</a>
</fieldset>
</form>
</div>
</div>
                    
  <style>
    /* IPB Login Panel Page by Red */
#login_form{margin:0 auto;width:70%}
.maintitle{background: url('http://community.invisionpower.com/filestore/public/style_images/master/maintitle.png') repeat-x scroll center top #2C5687;border-color:rgba(0,0,0,0.1);border-radius:4px 4px 0 0;border-style:solid;border-width:1px;box-shadow:0 1px 0 rgba(255,255,255,0.4) inset;color:#FFF!important;font-size:16px!important;font-weight:300!important;padding:10px 10px 11px;text-shadow:1px 1px 1px rgba(0,0,0,0.3)}
.bar{background:none repeat scroll 0 0 #eff4f7;padding:8px 10px}
h3,strong{font-weight:bold!important}
.ipsForm_vertical .ipsField{margin-bottom:10px}
.ipsField .ipsField_title{font-size:15px;font-weight:bold}
.ipsForm_vertical .ipsField_content{margin-top:3px}
.input_text,.ipsTagBox_wrapper{background:none repeat scroll 0 0 #fff;border-color:#848484 #c1c1c1 #e1e1e1;border-radius:2px;border-style:solid;border-width:1px;padding:4px}
.desc,.desc.blend_links a,p.posted_info{color:#777;font-size:12px}
.ipsType_smaller,.ipsType_smaller a{font-size:11px !important}
.ipsType_smaller,.ipsType_smaller a{font-size:11px !important}
a{color:#225985;text-decoration:none}
#other_signin{width:35%}
.right{float:right}
.ipsPad_double{padding:9px 19px}
#register_form hr,#login_form hr{-moz-border-bottom-colors:none;-moz-border-left-colors:none;-moz-border-right-colors:none;-moz-border-top-colors:none;border-color:#ebebeb;border-image:none;border-style:solid;border-width:1px 0 0;clear:both;display:block;margin:10px auto;width:95%}
fieldset.submit{padding:15px 6px!important;text-align:center!important}
fieldset.submit{background-color:#d1ddea!important}
.input_submit{border-style:solid;border-width:1px;cursor:pointer;padding:4px 10px;text-decoration:none}
.input_submit{background:url("http://community.invisionpower.com/filestore/public/style_images/master/topic_button.png") repeat-x scroll center top #212121;border-color:#212121;border-radius:3px;box-shadow:0 1px 0 0 #5c5c5c inset,0 2px 3px rgba(0,0,0,0.2);color:#fff}
input,select{font:13px helvetica,arial,sans-serif}
.cancel{color:#ad2930;font-size:0.9em;font-weight:bold}
body#ipboard_body fieldset.submit,body#ipboard_body p.submit{text-align:center}
input#ips_username.input_text{background-image:url("http://www.nyit-nyit.net/public/style_images/biruv3/user.png");background-position:7px 50%;background-repeat:no-repeat;border:1px solid #cbd2db;margin-left:0;padding:6px 60px 6px 28px}
input#ips_password.input_text{background-image:url("http://www.nyit-nyit.net/public/style_images/biruv3/key.png");background-position:7px 50%;background-repeat:no-repeat;border:1px solid #cbd2db;margin-left:0;padding:6px 60px 6px 28px}
 </style>