Edit Halaman Login Mikrotik

12/25/2010 12:04:00 pm

Untuk mengedit halaman login mikrotik hanya dibutuhkan file login dari mikrotik, kemudian tinggal di edit dengan web editor, dalam hal ini netcomp menggunakan dreamweaver.

netcomp akan memberikan contoh dan langkah-langkah mengedit halaman logi mikrotik mulai dari mengcopy paste hingga contoh halaman login yang telah di edit (yang sederhana saja,,hehehe :)

langkah pertama adalah masuk dulu ke winbox application (jika belum ada download dulu)

lalu...
kemudian anda akan masuk dalam aplicasi winbox. kemudian klik menu file seperti pada gambar:




kemudian copy menu login yang berada pada folder hotspot (lihat gambar)..

kemudian paste di folder yang anda inginkan (paste terserah anda yang jelas jangan di winbox,, sama aja bo'ong kali, hehehe)
setelah di paste silahkan di edit sesuai keinginan anda, bisa di cari di google. tapi ku kasih contoh hasil edit halaman login mikrotik, walaupun simpel alias sederhana tapi mudah-mudahan bermanfaat.

nih source code nya ( gua pakedream weaver):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> NETCOMP HOTSPOT > login</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="-1" />
<style type="text/css">
body {
    color: #737373;
    font-size: 16px;
    font-family: verdana;
    background-color: #000000;
}

textarea,input,select {
background-color: #FDFBFB;
border: 1px solid #BBBBBB;
padding: 2px;
margin: 1px;
font-size: 14px;
color: #FF3300;
}

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; }
body,td,th {
    color: #FFFFFF;
}
.style1 {color: #FF3300}
.style2 {color: #FFFFFF}
.style3 {color: #FF6600}
.style4 {font-size: 36px}
.style5 {color: #FF3300; font-size: 9px; }
.style6 {color: #FFFF00}
.style7 {color: #00CC00}
.style8 {font-size: 9px}
#Layer1 {
    position:absolute;
    width:252px;
    height:255px;
    z-index:1;
    left: 91px;
    top: 301px;
}
#Layer2 {
    position:absolute;
    width:269px;
    height:34px;
    z-index:2;
    left: 740px;
    top: 243px;
}
#Layer3 {
    position:absolute;
    width:200px;
    height:251px;
    z-index:2;
    left: 771px;
    top: 302px;
}
.style12 {font-size: 36px; color: #FF0000; }
.style13 {
    color: #FF0000;
    font-weight: bold;
}
.style15 {color: #FF0000; font-weight: bold; font-style: italic; }
.style16 {font-weight: bold}
.style17 {font-size: 24px}
.style19 {
    font-size: 36px;
    font-weight: bold;
    color: #FF0000;
}
.style20 {color: #0000FF}
</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 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)

<div align="center">
<a href="$(link-login-only)?target=lv&amp;dst=$(link-orig-esc)" class="style4"><span class="style2">NET</span><span class="style1">COMP</span></a></div>

<table width="100%" style="margin-top: 0%;">
    <tr>
      <td height="47" align="center" valign="middle"><img src="/img/netcomp.png" alt="mikrotik" /></td>
  </tr>
    <tr>
      <td align="center" valign="middle"><marquee direction=”up” scrollamount=”5″>
      <strong>Net<span class="style1">Com</span> Siap <span class="style1">Melayani</span> Anda. <span class="style6">Dapatkan Segera voucher anda di gerai kami!! Perum. Kedung Turi Permai K-4      </span></strong>
      </marquee>
        <span class="style6"><strong><span class="style7">SEGERA HUBUNGI KAMI Telp: 031-7889106, Hp: 0856 554 80002 </span></strong></span></td>
  </tr>
    <tr>
      <td align="center" valign="middle"><span class="style12"><blink><span class="style17">Ingin Internet-an?? beli voucher-nya segera.. 2500,-/jam </span></blink></span></td>
  </tr>
    <tr>
      <td height="155" align="center" ><p class="style17"><strong>PROMO!!!</strong></p>
        <p class="style17">PAKET BERLANGGANAN <span class="style20">HANYA</span> <span class="style19"><blink>RP. 150.000,-/BULAN</blink></span></p>
      <p class="style17"><span class="style17 style6">UNLIMITED, INTERNETAN SEPUASNYA!!! BURUAN DAFTAR </span></p>        </td>
  </tr>   
    <tr>
    <td align="center" valign="middle">
        <div class="notice" style="color: #c1c1c1; font-size: 9px">Silahkan <span class="style3">Masukkan</span> login <span class="style1">dan</span> Password <span class="style3">yang tertera</span> pada voucher <span class="style1">yang telah</span> anda beli <br />
      $(if trial == 'yes')Free trial available, <a style="color: #FF8080"href="$(link-login-only)?dst=$(link-orig-esc)&amp;username=T-$(mac-esc)">click here</a>.$(endif)</div>
        <p>&nbsp;</p>
      <table width="305" height="219" border="0" cellpadding="1" cellspacing="1" style="border: 0px solid #cccccc; padding: 0px;">
            <tr>
                <td width="303" height="149" colspan="" align="center" valign="top">
                    <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" bgcolor="#FF3300"><strong>login</strong></td>
                                        <td bgcolor="#FF3300"><input style="width: px" name="username" type="text" value="$(username)"/></td>
                                </tr>
                                <tr><td align="right" bgcolor="#FF3300"><strong>password</strong></td>
                                        <td bgcolor="#FF3300"><input style="width: px" name="password" type="password"/></td>
                                </tr>
                                <tr><td bgcolor="#FF3300">&nbsp;</td>
                                        <td bgcolor="#FF3300"><input type="submit" value="OK" /></td>
                                </tr>
                      </table>
                            <div align="center"></div>
              </form>                </td>
            </tr>
            <tr><td height="67" align="center"><a href="http://www.mikrotik.com" target="_blank" style="border: none;"><img src="/img/logobottom.png" alt="mikrotik" align="bottom" /></a></td>
            </tr>
      </table>
        <div style="color: #c1c1c1; font-size: 7px">
      <p align="center" class="style5 style8"><span class="style2">Rp. 2500,-/<span class="style1">Jam</span></span> <span class="style2">--&gt;</span> <span class="style1">Hubungi:</span> <span class="style2">031-7889106</span> <span class="style1">atau sms ke:</span> <span class="style2">0856 554 80002</span> </p>
      <p align="center" class="style5"><span class="style2">Net</span>Comp ----&gt; <span class="style2">Randy</span> email: <span class="style2">randyose@yahoo.com </span></p>
      <p align="center" class="style5"><span class="style2">Perumahan</span> Kedung Turi Permai BloK K-4 Taman <span class="style2">Sidoarjo </span></p>
    </div>
    <p><span class="style16"><span class="style3">Terima Pesanan: - Komputer/PC Rakitan pentium 4, &nbsp; dual core, core 2 duo, core i3 , </span>- flashdisk kingstone, CD blank, - Service Komputer/ Laptop, <span class="style3">- Design Web, Logo, Cover Buku, &nbsp; &nbsp; Spanduk</span></span> </p>
    <p>$(if error)<br />
      </p>
    <div style="color: #FF8080; font-size: 9px">$(error)</div>$(endif)    </td>
  </tr>
    <tr>
      <td height="19" align="center" valign="middle"><p align="center" class="style16">Assalamu'alaikum.. kepada seluruh pelanggan Net<span class="style1">com</span>: Gunakanlah Layanan Kami dengan sebaik-baiknya, Carilah Sesuatu Yang bermanfaat Bagi Anda dan keluarga Anda. Bila Anda menemui situs yang bermuatan Pornografi, <span class="style13">catat dan laporkan</span> pada kami, agar kami bisa <span class="style15">memblokir</span> situs tersebut. Terima kasih Atas Kerja Sama ini. :) </p>      </td>
  </tr>
</table>

<script type="text/javascript">
<!--
  document.login.username.focus();
//-->
</script>
</body>
</html>

udah selesai,, silahkan copy paste kalo mau,, hehehe... tapi jangan lupa comment ya,, walau hanya ucapan terima kasih ( GE-ER) hehehe :) salam NETCOMP...

Share this

Related Posts

Previous
Next Post »

3 komentar

Write komentar