Langsung ke konten utama

Cara Membuat Click Image untuk Login Hotspot Mikrotik

Pernah suatu saat saya akses ke wifi gratis, dimana setelah konek ke SSID Wifi itu web browser langsung di redirect ke halaman Login. Namun, saya tidak perlu memasukkan username dan password untuk login, cukup klik gambar yang bertuliskan "Lanjutkan". Setelah itu saya bisa browsing sepuasnya dengan gratis :D.

Apakah anda juga pernah mengalaminya? Jika belum bisa coba konek ke SSID free@Wifi.id di tempat-tempat tertentu.

Oke, artikel kali ini saya akan membahas tentang bagaimana caranya membuat halaman login hotspot Mikrotik menggunakan klik gambar (image) untuk login, tanpa perlu memasukkan username dan password. Contoh nya seperti gambar berikut :



Prasyarat :

1. Pastikan Mikrotik Anda sudah bisa konek ke Internet. (Cara mengkoneksikan Mikrotik ke Internet)
2. Pastikan Mikrotik Anda sudah di seting untuk Hotspot Mikrotik via WiFi. (Cara Membuat Hotspot di Mikrotik : Seting dasar Hotspot Mikrotik)
3. Pastikan Anda sudah punya aplikasi untuk edit file HTML Login Hotspot Mikrotik. (Cara Mengganti Halaman Login Hotspot Mikrotik)

Setelah semua prasyarat tersebut dipenuhi, kita lanjut ke Setting Hotspot Mikrotik nya.

Setting Hotspot Mikrotik

1. Masuk ke Menu IP --> Hotspot --> Server Profile --> Buka Profile Server yang digunakan --> Masuk ke Tab Login --> Pilih Login by : HTTP CHAP, HTTP PAP, Trial (Bila perlu) --> OK


2. Buat User Profile Baru untuk Trial di menu User Profiles -->  Isi Shared Users yang banyak --> Batasi speed nya di kolom Rate Limit (bila perlu) --> OK



3. Buat User baru untuk Trial di menu Users --> Isikan username dan password, disini saya isikan trial --> Pilih Profile TRIAL --> OK


Sampai disini Setting Hotspot Mikrotik Selesai. Selanjutnya Setting Halaman Login Hotspot Mikrotik. Disini saya contohkan menggunakan Software Adobe Dreamweaver untuk mengedit HTML Login Hotspot Mikrotik.

Setting Halaman Login Hotspot Mikrotik

1. Buat file image yang nantinya akan digunakan sebagai tombol login user.

2. Copy ke folder images pada direktori halaman login Mikrotik

3. Edit halaman login Mikrotik menggunakan aplikasi HTML editor.

4. Hapus semua form login dan tombol login, gantikan dengan code berikut :
<input type="hidden" name="username" value="trial">

<input type="hidden" name="password" value="trial">
Pada value, isikan uername dan password hotspot yang sebelum nya sudah dibuatkan.

5. Masukkan file gambar (image) yang akan digunakan sebagai tombol login, dengan code berikut :
<input type="image"" src="./images/kliklogin.png" name="submit"/>
Isikan path image Anda pada label kuning. Pastikan submit terisi pada label orange.
Untuk lebih jelasnya silakan lihat gambar berikut ini :


6. Setelah selesai mengedit, silakan upload file halaman login nya ke Mikrotik. Caranya sudah pernah saya bahas disini : Cara Mengganti Halaman Login Hotspot Mikrotik

Hasilnya seperti ini :


Setelah klik tombol login image, kita bisa login hotspot mikrotik menggunakan user trial yang sebelumnya kita buat.


Gimana, mudah bukan? Kalo masih bingung silakan download file Halaman Login Mikrotik yang saya edit di atas. 
Download disini

Postingan populer dari blog ini

Cara Install Mikrotik di Virtual Private Server (VPS)

Virtual Private Server (VPS) adalah suatu Server yang dibagi menjadi beberapa Virtual Machines (VM) dimana setiap VM merupakan Virtual Server yang dapat di install sistem operasi tersendiri.  Misalnya seperti PC/Laptop kita yang diinstal VMWare atau VirtualBox untuk menjalankan OS tertentu. Disini tentunya kita bisa membuat beberapa VM untuk menjalankan OS yang kita inginkan. Nah, VPS yang dimaksud adalah VPS cloud yang sudah terhubung ke jaringan internet. Untuk menggunakannya kita bisa menyewa VPS yang disediakan oleh berbagai vendor hosting server. Disini saya menggunakan VPS dari Digital Ocean dengan menyewa Virtual Server di Singapore. Untuk apa install Mikrotik di VPS? Ada beberapa kegunaan mikrotik yang bisa kita manfaatkan karena Mikrotik nya akan mempunyai IP Publik, misalnya digunakan sebagai VPN Server , Proxy Server , atau hanya sekedar untuk ngelab saja. Jadi ini merupakan salah satu cara mendapatkan IP Publik pada Mikrotik :D. Oke, langsung saja kita simak Tutorial M...

Cara Trunk VLAN dari Cisco ke Mikrotik

Membuat Trunk dan VLAN dari Switch Cisco ke Mikrotik akan kita bahas pada Tutorial Mikrotik kali ini, menyembung artikel sebelumnya tentang Cara Trunk VLAN di Mikrotik ke Cisco Switch. Untuk menyambungkan Trunk & VLAN dari Switch Cisco ke Mikrotik sebenarnya sangat simpel dan mirip dengan membuat Trunk & VLAN dari Mikrotik ke Cisco. Tutorial Mikrotik kali ini lebih membahas tentang Mikrotik yang menerina Trunk VLAN dari Switch Cisco dan menyalurkan nya ke client melalui port ether Mikrotik dengan memanfaatkan Bridge VLAN dan ether nya.   Cara Setting Trunk VLAN dari Cisco ke Mikrotik  1. Pastikan Setting Trunk dan VLAN di Cisco sudah di config dengan benar. Contoh nya seperti gambar berikut : 2. Download Winbox Mikrotik --> Buka Winbox, buat interface VLAN nya, seperti pada artikel sebelumnya Cara Trunk VLAN di Mikrotik ke Cisco Switch. 3. Buat interface Bridge untuk tiap VLAN. Bridge VLAN 10 Bridge VLAN 20   4. Masuk ke tab Port --> Tambahkan Port VL...

Cara Trunk VLAN di Mikrotik ke Cisco Switch

Membuat Trunk dan VLAN di Mikrotik untuk dikoneksikan ke Switch Cisco akan kita bahas pada Tutorial Mikrotik kali ini. Pertanyaannya, Bisakah membuat VLAN dan Trunk pada Mikrotik dan Cisco? Jawabannya jelas bisa, karena VLAN dan Trunk ini adalah teknologi yang universal jadi bisa berjalan di semua perangkat jaringan walaupun beda merk. VLAN Menggunakan standar IEEE 802.1Q. Komite IEEE membuat standar metode VLAN multiplexing ini untuk memberikan dukungan VLAN multivendor. Trunk dan VLAN dapat membantu kita ketika harus melewatkan banyak segment jaringan sementara jalur yang tersedia terbatas. Pada artikel mikrotik kali ini akan saya contohkan ada segment jaringan yang ingin dilewatkan sementara jalur (kabel LAN) nya hanya ada satu. Jadi untuk mengatasinya kita bisa menggunakan VLAN dan Trunk 1 port di Mikrotik.    Topologi nya sengaja saya buat sangat sederhana supaya lebih mudah dipahami. Jika sudah paham, bisa kita kembangkan ke topologi yang lebih besar dan kompleks. Pada ...