This is my hotspot directory, computer using the hotspot/login.html, the mobile device login using hotspot/lv/login.html. I have already edited the hotspot/lv/alogin.html.
<html>
<head>
<title>mikrotik hotspot > redirect</title>
<meta http-equiv="refresh" content="2; url=$(link-redirect)">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<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: 12px; font-family: verdana; }
a, a:link, a:visited, a:active { color: #AAAAAA; text-decoration: none; font-size: 12px; }
a:hover { border-bottom: 1px dotted #c1c1c1; color: #AAAAAA; }
img {border: none;}
td { font-size: 12px; color: #7A7A7A; }
-->
</style>
<script language="JavaScript">
<!--
function startClock() {
location.href = '$(link-redirect)';
}
//-->
</script>
</head>
<body onLoad="startClock()">
<table width="100%" height="100%">
<tr>
<td align="center" valign="middle">
You are logged in
<br><br>
If nothing happens, click <a href="$(link-redirect)">here</a></td>
</tr>
</table>
</body>
</html>
This is the mobile device login using hotspot/lv/login.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>internet hotspot > login</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="-1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style type="text/css">
body {color: #737373; font-size: 100%; font-family: verdana;}
textarea,input,select {
background-color: #FDFBFB;
border: 1px solid #BBBBBB;
padding: 2px;
margin: 1px;
font-size: 1em;
color: #808080;
}
a, a:link, a:visited, a:active { color: #AAAAAA; text-decoration: none; font-size: 0.625em; }
a:hover { border-bottom: 1px dotted #c1c1c1; color: #AAAAAA; }
img {border: none;}
td { font-size: 1em; color: #7A7A7A; }
.STYLE1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
</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="false" />
</form>
<script type="text/javascript" src="/md5.js"></script>
<script type="text/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)
<table width="100%" style="margin-top: 10%;">
<tr>
<td align="center" valign="middle">
<div class="STYLE1 notice" style="font-size: 1.6em">XXXXXXXX</div><br />
<table width="280" height="270" style="border: 1px solid #cccccc; padding: 0px;" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="bottom" height="175" colspan="2">
<center>请登录后使用</center><br />
<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="false" />
<table width="85%" style="background-color: #ffffff">
<tr>
<td width="30%" align="right">用户名</td>
<td width="60%"><input style="width: 8em" name="username" type="text" value="$(username)"/></td>
</tr>
<tr>
<td align="right">密码</td>
<td><input style="width: 8em" name="password" type="password"/></td>
</tr>
<tr><td> </td>
<td width="40%" align="left"><br /><input type="submit" value="进 入" /></td>
</tr>
</table>
</form>
</td>
</tr>
<tr><td align="center">$(if error)<div style="color: #FF8080; font-size: 1em">$(error)</div>$(endif)</td></tr>
</table>
<br />
<div style="color: #c1c1c1; font-size: 0.8em">Powered by XXXXXXXX 2014 </div>
</td>
</tr>
</table>
<script type="text/javascript">
<!--
document.login.username.focus();
//-->
</script>
</body>
</html>
but the hotspot's status.html is always popup!