AI Insights
Generate a summary and suggested tags for this post.
Halaman login bawaan MikroTik terlihat sangat plain — background abu-abu, tombol biasa. Padahal ini adalah impression pertama pengguna WiFi kamu. Ubah jadi tampilan branded profesional dengan sedikit HTML/CSS.
Struktur Folder Hotspot
Semua file halaman hotspot disimpan di folder hotspot di router.
| File | Fungsi |
|---|---|
login.html | Halaman login utama |
logout.html | Halaman logout |
status.html | Halaman status setelah login |
alogin.html | Auto login redirect |
error.html | Halaman error |
gambar/ | Folder gambar (logo, background) |
Langkah Ganti Halaman Login
1. Aktifkan FTP di MikroTik
/ip service enable ftp
2. Download File Hotspot
Login FTP ke router (username: admin, host: IP router), download folder hotspot ke laptop.
3. Edit login.html
Buka file di editor favorit (VS Code). Contoh struktur minimal:
<html>
<head>
<title>Hotspot Login</title>
<link rel="stylesheet" href="gaya.css">
</head>
<body>
<div class="kotak">
<img src="gambar/logo.png" alt="Logo">
<h1>Selamat Datang</h1>
<form name="login" action="$(link-login-only)" method="post">
<input name="username" placeholder="Nama Pengguna">
<input name="password" type="password" placeholder="Kata Sandi">
<input name="dst" type="hidden" value="$(link-orig)">
<button type="submit">Masuk</button>
</form>
</div>
</body>
</html>Penting: variabel
$(link-login-only)dan$(link-orig)adalah MikroTik variable — jangan diubah, karena itu yang bikin login-nya jalan.
4. Upload Balik ke Router
Upload semua file hasil edit ke folder hotspot di router via FTP.
5. Test
Konek WiFi → buka browser → halaman baru sudah muncul.
Tips Desain Login yang Baik
| Element | Rekomendasi |
|---|---|
| Logo | PNG 200x100 px, transparan |
| Background | Gambar/warna brand kamu |
| Button | Warna kontras, jelas |
| Font | Sans-serif (Poppins/Inter) |
| Mobile | Wajib responsive |
Common Mistake
| Kesalahan | Akibat | Solusi |
|---|---|---|
| Ganti nama variabel MikroTik | Login tidak jalan | Biarkan $(...) apa adanya |
| Upload di root, bukan folder hotspot | Tidak diproses | Pastikan di /hotspot/ |
| Gambar terlalu besar | Loading lama | Kompres < 200 KB |
| CSS eksternal via CDN | Kadang gagal sebelum login | Inline atau upload lokal |
Kesimpulan
Ganti halaman login MikroTik cukup edit login.html dan upload via FTP. Jaga variabel MikroTik ($(link-login-only), $(link-orig)) — sisanya bebas kreasi. Untuk brand yang lebih kuat, lanjut baca Cara Menambahkan Logo pada Hotspot MikroTik.