Hai everyone! 
I have a problem to create a hotspot login page. My client doesnt want to use the Mikrotik Hotspot Login Page. My client wants to use their own login page with their company’s logo and picture. I tried to create it but after i enter the username and password, it doesnt authenticate. I can see that in the Mikrotik Hotspot login page there’s a coding to authenticate the username and password. How can i do it on my client’s login page?
please advice…thanks.
this is the Mikrotik Hotspot Login Page:
<html>
<head>
<title>mikrotik hotspot > login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="-1">
<style type="text/css">
<!--
textarea,input,select {
background-color: #FDFBFB;
border: 1px #BBBBBB solid;
padding: 2px;
margin: 1px;
font-size: 14px;
color: #808080;
}
body{ color: #737373; font-size: 10px; font-family: verdana; }
a, a:link, a:visited, a:active { color: #AAAAAA; text-decoration: none; font-size: 10px; }
a:hover { border-bottom: 1px dotted #c1c1c1; color: #AAAAAA; }
img {border: none;}
td { font-size: 14px; color: #7A7A7A; }
-->
</style>
</head>
<body>
$(if chap-id)
<form name="sendin" action="$(link-login-only)" method="post">
<input type="hidden" name="username">
<input type="hidden" name="password">
<input type="hidden" name="dst" value="$(link-orig)">
<input type="hidden" name="popup" value="true">
</form>
<script language="JavaScript" src="/md5.js">
</script>
<script language="JavaScript">
<!--
function doLogin() {
document.sendin.username.value = document.login.username.value;
document.sendin.password.value = hexMD5('$(chap-id)' + document.login.password.value + '$(chap-challenge)');
document.sendin.submit();
return false;
}
//-->
</script>
$(endif)
<div align="center">
<a href="$(link-login-only)?target=lv&dst=$(link-orig-esc)">Latviski</a>
</div>
<table width="100%" height="100%">
<tr>
<td align="center" valign="middle">
<div style="color: #c1c1c1; font-size: 9px">Please log on to use the mikrotik hotspot service</div><br>
<table width="240" height="240" style="border: 1px solid #cccccc; padding: 0px;" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="bottom" height="175" colspan="2">
<form name="login" action="$(link-login-only)" method="post"
$(if chap-id) onSubmit="return doLogin()" $(endif)>
<input type="hidden" name="dst" value="$(link-orig)">
<input type="hidden" name="popup" value="true">
<table width="100" style="background-color: #ffffff">
<tr><td align="right">login</td>
<td><input style="width: 80px" name="username" type="text" value="$(username)"/></td>
</tr>
<tr><td align="right">password</td>
<td><input style="width: 80px" name="password" type="password"/></td>
</tr>
<tr><td> </td>
<td><input type="submit" value="OK"></td>
</tr>
</table>
</form>
</td>
</tr>
<tr><td align="center"><a href="http://www.mikrotik.com" target="_blank" style="border: none;"><img src="/img/logobottom.png" /></a></td></tr>
</table>
<br><div style="color: #c1c1c1; font-size: 9px">Powered by mikrotik routeros © 2005 mikrotik</div>
$(if error)
<br><div style="color: #FF8080; font-size: 9px">$(error)</div>
$(endif)
</td>
</tr>
</table>
<script language="JavaScript">
<!--
document.login.username.focus();
//-->
</script>
</body>
</html>
This is my client’s login page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>XXXX wireless internet</title>
<style type="text/css">
<!--
.style9 {
font-family: Arial, Helvetica, sans-serif;
font-size: x-small;
color: #FFFFFF;
}
.style11 {font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; }
.style12 {color: #FFFFFF}
.style13 {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
font-size: 10px;
}
.style14 {font-size: xx-small}
.style15 {font-size: small}
-->
</style>
</head>
<body>
<table width="732" border="0" align="center" cellpadding="1" cellspacing="0" bgcolor="#000066">
<tr>
<td><div align="center">
<table width="730" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td width="450" valign="bottom"><div align="right"><img src="wifixs.gif" alt="Wireless Internet Access" width="207" height="28" /></div></td>
</tr>
<tr>
<td width="280"><div align="right"><img src="login.gif" alt="Login Here" width="280" height="30" align="top" /></div></td>
<td width="450" rowspan="2"><div align="left"><img src="hk01.jpg" alt="XXXX" width="450" height="300" align="top" /></div></td>
</tr>
<tr>
<td width="280" height="270" valign="top" bgcolor="#6699CC"><p> </p>
<table width="250" border="0" align="center" cellpadding="3" cellspacing="0">
<tr>
<td width="106" valign="top"><span class="style11">Username</span></td>
<td width="132" valign="top"><form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="textfield" />
</label>
</form> </td>
</tr>
<tr>
<td valign="top"><span class="style11">Password</span></td>
<td valign="top"><form id="form2" name="form2" method="post" action="">
<label>
<input type="text" name="textfield2" />
</label>
</form> </td>
</tr>
<tr>
<td colspan="2"><div align="center" class="style12">
<label><input type="submit" name="Submit" value="Log in" />
</label>
</div></td>
</tr>
<tr>
<td colspan="2"><p class="style9"> </p>
<p align="left" class="style9"><strong>Experiencing problems? </strong><br />
Please dial "0" on your room phone.</p></td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2" bgcolor="#FFFFFF"><table width="700" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
</tr>
<tr>
<td><p> </p>
<p align="center"><span class="style15"></span><br />
</tr>
</table></td>
</tr>
</table>
</div></td>
</tr>
</table>
</body>
</html>
Hope this will help! thanks!
Client’s page will not work, because it lacks all important login information and hidden input fields. take mikrotik login page and add the logo and additional text, leave all forms and input fields alone, then it will work.
thanks normis! i got it now! 