Pada tutorial kali ini kita akan mencoba untuk merubah tampilan login pada hotspot mikrotik, setelah pada tutorial sebelumnya kita berhasil untuk melakukan setting hotspot pada router mikrotik menggunakan eksternal akses point. Pada sistem hotspot, tentunya sebelum kita bisa menikmati akses internet kita diharuskan untuk melakukan login dengan langsung diarahkan ke page login ketika kita terhubung ke jaringan hotspot, tentu kalian bertanya-tanya sebenarnya darimana halaman login itu berasal?
 |
| Menu File yang berisi list file yang tersimpan didalam storage router mikrotik |
Halaman login tersebut berasal dari dalam storage penyimpanan router mikrotik sendiri, jika kalian buka menu File akan terlihat list file penyimpanan dari router mikrotik. Diantara file tersebut adalah login.html, alogin.html, rlogin.html, flogin.html. Untuk penjelasannya adalah sebagai berikut :
- login html : Merupakan sebuah halaman login yang ditampilkan untuk autentikasi user dengan memasukkan username dan password.
- alogin.html : Sebuah halaman yang ditampilkan setelah user berhasil di autentikasi. Halaman ini menampilkan sebuah pop-up tentang status dari halaman apakah 'Log In' atau 'Log Off' dan juga akan diredirect (otomatis/manual) ke halaman web yang diakses oleh user.
- rlogin.html : Sebuah halaman yang me-redirect user dari mengakases halaman URL ke halaman login, jika user tersebut memerlukan autorisai untuk melakukan akses.
- flogin.html : Sebuah halaman login yang ditampilkan apabila terdapat kesalahan (error) terjadi. Misal, ketika user salah memasukkan 'Username' maupun 'Password'.
Kemudian untuk cara kerja dari request halaman /login adalah :
- Apabila user belum terautentikasi dan melakukan akses sebuah web maka akan di-redirect ke halaman login.html.
- Apabila prosedur login gagal (baik salah memasukkan username atau password), maka akan ditampilkan halaman flogin.html; Jika halaman flogin.html tidak ditemukan maka akan ditampilkan halaman login.html.
- Apabila user telah berhasil terautentukasi (login), alogin.html akan ditampilkan; apabila alogin.html tidak ditemukan maka akan langusung di-redirect ke halaman web yang di akses oleh user tersebut atau ke halaman status.
Untuk merubah tampilan halaman login pada hotspot, kalian hanya perlu merubah atau mengganti file login.html. Di internet saat ini juga sudah banyak beredar template gratis yang bisa kalian gunakan dan kustomisasi untuk halaman login hotspot kalian, pada tutorial kali ini kita akan mencoba untuk merubah tampilan halaman login hotspot dengan menggunakan template dan modifikasi script file htmlnya.
1. Template Hotspot
Siapkan template hotspot yang kalian inginkan. Kalian bisa browsing di google dengan keyword Template Login Hotspot Mikrotik dan kalian bisa mendownload template loginnya sesuai dengan kebutuhan dan selera kalian masing-masing. Jika sudah buka folder template hotspot tersebut dan buka menu File pada winbox.
 |
| Pindahkan file template login ke dalam storage penyimpanan router mikrotik |
Kemudian jika sudah, kalian pindahkan folder template tersebut ke dalam storage router mikrotik dengan cara drag & drop, klik folder templatenya kemudian pindahkan ke dalam jendela menu file winbox.
Jika kalian sudah memindahkan template ke dalam storage router mikrotik, pastikan juga bahwa kalian sudah merubah HTML Directory pada server profile hotspot kalian ke directory template login yang baru dengan membuka menu IP-Hotspot lalu pilih tab Server Profiles dan klik 2x pada server profile hotspot yang kalian gunakan untuk melakukan pengeditan.
 |
| Server Profile Hotspot |
Kemudian pada opsi HTML Directory, klik drop down button dan pilih directory template hotspot kalian yang baru, pada tutorial kali ini, kita menyimpan template loginnya pada folder flathotspot dan menyimpannya pada storage disk 1 router mikrotik, setelah directory sudah dipilih selanjutnya klik OK.
 |
| HTML Directory File Login untuk Hotspot |
Jika sudah kalian bisa mencoba untuk login ke hotspot kalian untuk melihat perubahan tampilan login hotspot kalian, disini kita menggunakan template flat style landing page dan terlihat perubahan pada halaman login hotspotnya.
 |
| Halaman Login Hotspot sudah berubah |
2. Script HTML
Selain menggunakan template, kalian juga bisa untuk merubah tampilan loginnya dengan merubah script pada file login.html, kalian hanya perlu mendownload file login.html dari storage mikrotik kemudian kalian bisa menggunakan text editor seperti visual studio code untuk memodifikasi scriptnya, karena scriptnya menggunakan bahasa pemrograman web seperti html dan css, maka kamu harus memahami bahasa pemrograman tersebut sebelum melakukan perubahan pada script htmlnya.
 |
| Script dari file login.html |
Setelah kalian melakukan pengeditan pada script html, kalian save kemudian kalian bisa melakukan penguploadan kembali ke storage mikrotik dengan cara drag & drop.
Jadi seperti itu tadi pembahasan kita tentang Tutorial cara untuk mengubah tampilan login pada hotspot mikrotik. Sekian untuk tutorial kali ini, semoga ilmu yang kalian dapat dari tutorial ini bisa bermanfaat untuk kalian semua. Terima kasih.
Referensi :
<https://citraweb.com/artikel_lihat.php?id=138>
