Cara Mengganti Halaman Login Hotspot Mikrotik Cara Mengganti Halaman Login Hotspot Mikrotik - Bagi anda yang sudah membuat Hotspot di Mikrotik nya pastinya tau kan gima gimana na tamp tampililan an hala halama mann logi loginn defa defaul ultt Mikr Mikrot otik ik nya. nya. Tampi ampila lann nnya ya simp simple le dan dan cend cender erun ungg memb membos osan anka kan. n. Nah, Nah, sebenarnya Halaman Login Hotspot Mikrotik dapat Mikrotik dapat kita edit, modifikasi, dan ganti sesuai keinginan kita loh. Jadi halaman login default Mikrotik yang simple itu bisa kita buat jadi keren abis. imana caranya! ampang kok, konsepnya hampir sama kaya bikin "eb sederhana. Jadi anda paling tidak harus ngerti bahasa HTM# sedikit-sedikit, dan sedikit sentuhan desain tentunya.
$ke, sebelum mulai Belajar Mikrotik kali Mikrotik kali ini persiapkan dulu senjatanya % & HTM# editor % 'ream"ea(er, Notepad)), dll & *icture editor % +orel'ra", *hotoshop, dll
*astikan Hotspot Mikrotik anda Mikrotik anda sudah jalan, coba akses halaman login hotspot anda di Bro"ser.
Buka inbo, masuk ke menu iles. /emua file halaman login hotspot ada di folder hotspot.
0gar bisa mengedit file nya, copy dulu file di folder hotspot itu ke komputer. +aranya bisa dengan mengakses file itu (ia T*. Buka indo"s 1plorer, masukkan alamat berikut %ftp%22ipaddressmikrotik, misalnya % ftp%22345.367.388.3 #ogin dengan username dan pass"ord seperti pada "inbo.
Masuk ke folder hotspot. +opy semua file nya, ctrl ) a --& copy.
9alo sudah tinggal edit aja file .html nya pakai 'ream"ea(er atau Notepad)). :ntuk halaman login ada di file login.html.
/a(e file yang udah di edit itu, terus upload ke Mikrotik nya. +aranya sama seperti di atas, tinggal dibalik aja copy dari komputer ke mikrotik. +oba lihat hasil editannya. Buka halaman login Mikrotik nya, jadinya kaya gini %'
imana! masih membosankan tampilannya! $ke, gimana kalo diedit jadi seperti ini!
9eren ga! ;tu halaman login hotspot Mikrotik yang saya pasang di kosan %'. 9alo anda ingin juga bikin halaman login seperti itu, silakan do"nload aja contoh halaman login hotspot Mikrotik disini %
Download Halaman Login Hotspot Mikrotik
Terus edit aja file .html yang ada, misalnya login.html pakai 'ream"ea(er aja biar gampang.
:ntuk gambar banner dan logo nya silakan anda cari atau buat sendiri pakai +orel'ra" atau aplikasi lainnya.
Mengubah tampilan #ogin Hotspot di MikroTik 83.3< 9omputer No comments
/eperti terlihat diatas itu adalah salah satu gambar yang saya ambil dari google, itu adalah Hotspot login yang dibuat di MikroTik. Hotspot login sendiri yaitu sebagai gerbang antara user dengan internet untuk saling berhubungan sehingga user dapat menggunakan akses internet.
+ontohnya apabila anda sedang berada di sebuah ka"asan +offe 2 =estaurant seperti M+',9fc,0, dan lain sebagainya. sambil menunggu makanan anda ingin akses internet gratis >ree Hot/pot? kebetulan ditempat tersebut ada ree ii Hotspot nya, tapi ketika sudah coba connect dan masuk ke bro"ser untuk masuk ke sebuah "ebsite tiba-tiba masuk ke halaman login page seperti diatas contohnya. jadi anda harus bertanya terlebih dahulu kepada orang +offe 2 =estaurant tersebut untuk mengetahui pass"ord "ifi nya . Tapi kali ini saya akan membahas cara untuk mengganti tampilan dari Hotspot #ogin *agenya, karena untuk membuat hotspot login sudah saya share ebook nya. Berikut ini cara-caranya @ % 3. Buka Browser anda dan masuk ke Google setelah itu ketikkan ADownload Template Login Page MikroTik A otomatis ada banyak "ebsite yang menyediakan itu tinggal do"nload yang (ersi free nya saja. kalau mau yang berbayar silahkan . 5, /etelah itu Download template nya. ini adalah template yang saya do"nload >DOWNLOAD ? . /etelah di do"nload kita akan menemui file html dan teman-temannya.
<. 9ita lihat terlebih dahulu tampilan login.html
C. /ekarang, saya ingin mengganti Title Name seperti gambar diatas. kita masuk ke folder template yang sudah di etract dan dido"nload tadi lalu kita lik kanan !ile Login.html " #dit with Notepad $ %&ka notepad dan tarik !ile login.html n'a ke notepad. 6. 'isini saya akan 1dit title nya saja, untuk anda jika ingin mengedit yang lain silahkan. setelah di edit (A)#
edit title D. Berikutnya, masuk ke inBo mikroTik. masukkan admin dan pass"ord nya seperti biasa 7. #alu klik *P " Hotspot " Hotspot (et&p. lakukan tahap berikut ini
Hotspot inter!a+e, Lo+al " Ne-t Lo+al Address o! Network, ./.0.1$2 " Ne-t Address Pool o! Network " Ne-t (ele+t Certi!i+ate " Ne-t *P address o! (MTP ser3er " Ne-t DN( (er3er " Ne-t DN( Name " Ne-t Create Lo+al Hotspot 4ser " Name o! &ser , admin5 password , admin " Ne-t 6*ni &nt&k mem%&at &ser $ +lient7 setelah selesai nanti akan ada muncul jendela A/etup has +ompletlyA 4. /elanjutnya ke Tab iles
lalu tarik folder Hot/pot ke 'esktop anda, lalu buka older hotspot nya
'0N buka folder Template #ogin *age MikroTik yang tadi sudah kita do"nload lalu tekan tombol CT8L 9 A okCT8L9C
Buka older Hotspot nya lalu *aste & =eplace & E1/ lalu =ename 2 ganti nama older H$T/*$T sesuai dengan keinginan anda. saya menamainnya Merdeka Hot(pot #alu drag kembali folder yang sudah kita rename ke inBo iles
9lik tab *P " Hotspot " ta% (er3er Pro!iles dan pilih yang Ahspro!A klik 5 kali
APPL: " O ; /ekarang kita tes untuk buka """.google.com dan apabila tidak masuk dan tampilannya seperti diba"ah ini, berarti berhasil, masukkan akun user yang tadi kita buat untuk login dan menikmati koneksi internet /elamat Mencoba @@
T&torial Mem%&at HOT(POT Dengan M*8OT* 9 Login MOD Perlengkapan 'ang di%&t&hkan , Modem >Eang sudah terhubung ;NT1=N1T? MikroTik =B 2 $/ ireless 0dapter 2 0ccess *oint 5 9abel :T* /oft"are inbo /oft"are in/+* ile login.html yang sudah di Modifikasi • • • • • • •
Topologi Jaringan yang akan digunakan untuk Membuat 9onfigurasi Jaringan Hotspot 'i MikroTik 'engan inbo.
on!ig&rasi Hotspot , Buka inbo dan mencari Mac 0ddress untuk login, klick M0+ 0ddressnya bukan ;* 0ddress nya. •
•
/etelah memilih Mac 0ddress , login menggunakan default yaitu , #ogin % Admin . *ass"ord % F9osongG
•
/etelah berhasil login, kita dapat melihat ;nterfaces MikroTik tersebut di "inbo.
•
•
1dit nama ;nterfaces agar mudah melakukan konfigurasi, ether3 *nternet , ether5 Wi!i Hotspot, lihat gambar di ba"ah ini.
Berikutnya kita harus mengisikan ;* 0ddress pada masing-masing ether yg sudah di beri nama. Menu *P I Address I <9=
•
•
•
Masukan ;* 0ddress untuk ether Wi!i Hotspot 192.168.1.1/24, kemudian klik O.
/etelah memasukkan ;* 0ddress ether Wi!i Hotspot, /ekarang kita menggunakan DHCP Client untuk mendapatkan *P *nternet. Menu I *P I DHCP Client I <9=
*ilih lah ;nterfaces *NT#8N#TK dan klik O.
•
•
:ntuk melihat *P address yang telah di konfigurasi. Menu I *P I Address I 0kan muncul Address List. lihat gambar di ba"ah ini.
/elesai 9onfigurasi ;* setiap ether, sekarang kita akan membuat Hotspot. Menu I *P I Hotspot I Hotspot (et&p. #ihat gambar di ba"ah ini.
•
•
•
•
•
*ilih Hot(pot *nter!a+e I W*>* HOT(POT.
9lik Net karena ;* interface Wi!i Hotspot sudah seperti yang telah di konfigurasi dan beri centang pada Mas?&erade Network.
;si Address Pool. *ada tahap ini kita menentukan ;* berapa sampai dengan ;* berapa yang dapat menggunakan Wi!i Hotspot. +ontoh % 192.168.1.10-192.168.1.100 > hanya ;* dari 192.168.1.10 sampai dengan ;* 192.168.1.100 yang dapat menggunakan Wi!i Hotspot ?.
/elanjutnya konfigurasi ((L, karena kita tidak menggunakan //#, pada select +ertificate, pilih saja none lalu klik ne-t.
9onfigurasi *P (MTP (er3er. Jika anda memiliki (MTP (er3er, silahkan masukkan *P (MTP (er3er anda, karena saya tidak punya maka langsung Ne-t.
•
•
•
/elanjutnya 9onfigurasi DN(, 9arena DN( sudah auto detect dari ;nterface ;nternet, maka tidak perlu di konfigurasi lagi. #angsung klikNe-t. >jika belum ada, silahkan isi 'N/ yang anda inginkan?.
:ntuk DN( Name di kosongkan saja dan klik Net. >jika anda ingin memberi nama, silahkan?.
Berikut tahap membuat user hotspot login. :ser % admin dan *ass"ord % kosong. >isi dengan yang anda inginkan?. 9emudian 9lik Ne-t.
•
/etup membuat Hotspot sudah selesai. /eperti terlihat pada gambar di ba"ah ini.
•
'an ini hasil membuat Hotspot tadi. #ihat gambar di ba"ah.
•
•
•
9lik pada menu (er3er Pro!iles dan isi DN( Name untuk Hotspot Login dan melimit band"idth user Hotspot, seperti terlihat pada gambar di ba"ah.
Membuat user login lebih banyak lagi, *ilih Tab <4sers= I <9= I ;sikan Name > /ebagai :ser ? *ass"ord > 9ode *engaman ?.
'an seperti ini hasil kita membuat user Hotspot login.
•
•
9emudian lakukan percobaan pada client yang sudah terkoneksi Wireless$A++ess Point. Buka bro"ser ketik http,$$www.google.+om, maka secara otomatis akan direct ke sbp-hotspot2login karena 'N/ Name yang telah di konfigurasi tadi.
/etelah memasukkan :sername beserta *ass"ord dan berhasil login akan muncul seperti gambar di ba"ah ini.
/etelah tampilan di atas muncul maka ;nternet sudah dapat digunakan, akan tetapi #ogin Hotspot masih terlalu simple, dan kita akan melanjutkan cara mengganti #ogin Hotspot seperti yang kita inginkan. ;kuti step-step berikut untuk mengganti tampilan #ogin Hotspot.Modi!ikasi Login Hotspot , Download Win(CP Download Login.html • •
'o"nload applikasi in/+* di atas, install pada komputer anda dan jalankan. 9emudian isi sesuai data MikroTik anda . . .
Hostname , *P Mikrotik. 4sername , admin Password , Password mikrotik Port n&m%er , @angan di&%ah5 %iarkan //
/etelah login akan tampil seperti gambar di ba"ah ini . . .
9lik file login.htmlK yang ada disebelah kanan, lalu drag and drop ke sebelah kiri. Maka file tersebut sudah ada di komputer anda. /ekarang tinggal mengedit file login.html tersebut seperti yang kita inginkan. Jika sudah selesai mengedit file login.html anda, kemudian drag n drop lagi file login.html yang sudah di edit ke sebelah kanan dan piih o(er"riteK. Jika sudah selesai melakukan step di atas maka kita bisa coba akses menggunakan hotspot client dan yang akan tampil halaman login seperti yang anda buat tadi. ;ni contoh editan Hotspot #ogin *age saya, silahkan do"nload link di atas jika anda ingin menjadikan refrensi pembelajaran cara membuat login.html hotspot mikrotik.
Terima kasih telah berkunjung, dan semoga Tutorial Membuat H$T/*$T 'engan M;9=$T;9 ini bermanfaat %?
