2/08/2013

Merubah Login Page hotspot Part 2

Bila minggu kemarin saya posting cara merubah tampilan login hotspot bawaan mikrotik, untuk kali ini saya ingin bagi-bagi tips merubah login page hotspot part 2, disini juga bawaan mikrotik juga yang kita obok-obok. lho kok part 2 ? kan part 1 sudah yang ada tutorialnya kemarin sekarang bagian saya upload saja login page dengan tampilan dan tata letak baru. yuk disimak apa yang baru di login page part 2 ini.



Pada login page diatas terlihat berbeda bukan dengan tampilan login hotspot sebelumnya ?, bagi yang belum tahu tampilan antar muka part 1 silahkan klik disini kalau penasaran. gambar diatas terlihat perbedaan dari tata letak sebelumnya yaitu :
  • Tentunya yang pertama tapilan background yang berbeda dari posting kemarin
  • Ada penambahan 3 tombol navigasi halaman, yaitu tombol Home, daftar dan tombol kontak. jadi user yang ingin melihat info tinggal sobat masukkan infonya di masing-masing page tadi. 
  • Kotak atau form isian username dan password tidak lagi ditengah-tengah seperti tampilan default bawaan mikrotik tapi sudah pindah di samping kiri seperti gambar diatas.
  • ada tulisan berjalan-nya juga di bawah tombol navigasi.


  • Link tautan ke website sobat juga tersedia bila sobat ingin mempromosikan blog sobat di kalangan user pengguna hotspot.
Dibawah nanti saya sertakan file-file yang diperlukan biar tampilan tampak seperti diatas, dalam folder file nantinya ada file yang diperlukan agar tampilan seperti yang kita harapkan, isi folder yang saya sertakan yaitu kontak, login,registrasi ( format html ), file css dan folder img yang didalamnya ada imageuntuk latar dan tombol navigasi.

yang perlu sobat lakukan terhadap file tersebut adalah melakukan sedikit perubahan seperti :
  • bila ingin merubah background silahkan ganti dengan gambar selera sobat, file navigasipun juga bisa sobat ganti. semua ada di folder 'img'. tapi ingat nama dan format harus sama persis.
  • untuk merubah tulisan promosi seperti di samping kanan gambar diatas sobat tinggal melakukan editing file ' login.html', caranya cari kode '<div id="right">', dibawahnya bisa sobat ganti tulisan yang bercetak tebal dengan tulisan selera sobat.
  • untuk mengganti tulisan berjalan-nya sobat tinggal cari kode '<marquee>' , ganti tulisan yang bercetak hitam tebal dengan tulisan selera sobat.
  • begitu juga di halaman daftar dan kontak, sobat bisa edit file 'kontak.html' dan 'registrasi.html'. silahkan edit tulisan hitam bercetak tebal dengan selera sobat.
 Nah, dibawah ini saya sertakan file login page hotspot yang saya janjikan, semoga bermanfaat dan memberi warna sendiri pada usaha hotspot sobat semua.aamiin.

50 komentar

kalau masalah beginian mank kang farhan jagonya, kyaknya abang udah aktif ngeblogging lagi nich, aseghhh :)

hehe...ngk jago bang..cuma dikit2 ngerti..klo ngk didokumentasikan ntar ilmunya melayang...hahaha...

Lama tidak bersilaturahmi di tempat Kang Farhan ini...
Terima kasih berbagi ilmunya

terimakasih mas ferry.... nanti saya silaturrahim balik ya...sambil icip2 snack di rumah mas ferry...hahayyy

kang farhan memang jago nih ,,, untuk selanjutnya mungkin bagaimana cara membuat login hotspot bedasarkan NIM atau NIS untuk kawasan pendidikan pak

Asik jg usul mas putra... Sbarnya itu tinggal memasukkan settingan tiap user brdsarkn nim/nis di mikrotiknya..jd intinya sama..kan mau dftr nt ada user/pass yg di kelola admin yg mgang servr mikrotiknya... Semangat mas putra

asiik, dpt ilmu baru di sini, udh lama bgt aku gak mampir sini Kang?
pa kabar?

nice share, ane jarang banget pake wifi :D

Hebat ini sob,,,cara merubah tampilannya jadi refrensi juga sob jika jadi admin Hotspot untuk ngatur masalah tampilan waktu loginnya.

hehe...saya juga jarang nongol bang...baru minggu2 ini giat lagi jalan2...hahayyyy

Benar sangat berbeda nyata denga yang sebelumnya, Terima kasih sob infonya.

Wah ada link download'an nya nih! Boleh ya saya download, siapa tau suatu saat berguna..

Thanks berat bro! :

ini nih,,,postingan yang sangat bermanfaat ,, :)

saya juga menyimak komennya nih...hehehe

bermanfaat untuk kita semua pastinya...hahayyyy

mampir lagi gan, mohon maaf jika kurang berkenan

wahh asli saiia baru tau istilah satu ini..makasii kang iia ;)

saya belum ngerti soal ini.
semoga bermanfaat buat yang belum ngerti sperti saya..hehehe

mampir lagi kang sore2 menjelang malam ;)

info keren nih sobat sangat membantu,,,trimakasih sudah berbagi

hehe....saya juga baru ngerti....xixixi..makasih kunjungannya bang

hehe....buat yang ngerti dan yang belom buanyak terimakasih semoga besok jadi ngerti...xixixi...ah abang nih guaya lho...hahayyy

makasih juga buat sobat cahyo.... mkasih mas

aku pernah nyoba bikin om...
tapi kenapa ya kalo login dari hotspot lain yang beda port di mikrotiknya suka gagal login terus..?

gtu ya mas rawins...apa setelah memasukkan editan file login ke file mikrotik apa sudah direboot ulang mikrotiknya? atau di settingan user profilnya hotspot belom diarahkan ke foldernya file login yang baru saja dibuat ? kalau iya coba diarahkan mas settingan user profl hotspotnya...smga membantu :)

maaf kak, saya masih gaptek, ini bikinnya pakai html kan?

hehe...iya mas reki... ini file html...kan untuk tampilan browser mas... ^_^

Kemaren saya sempat ikut utak atik yang begini kang farhan sama teman,namun kalau saya perhatikan punya kang farhan ini lebih praktis dan gampang difahami..izin dulu ya kang mau aku sedot sambil belajarrrr.
Sebelumnya saya juga mohon maaf karena baru saja ngesot soalnya lagi ditengah laut samudera bersama kapal kecil yang setia menemani walau hanya lewat HP yang penting saya NGUBSEN..hahahahyyy

hahayyyy...sang suhu dateng juga aseekkkk...mantep banget...suatu saat aku ikut ke tengah samudra sama abang icah ahhhh...sambil liat lumba2..hahayyyy

keren nih sob, kebetulan nih saya banyak koleksi login page hotspot yang biasa saya gunakan untuk client saya yang dikombinasikan dengan mikrotik, artikel bagus sekali kang

sebenarnya bicara masalah hotspot, uing teh ga terlalu ngerti kh,, jeheheh..
menyimak mudahan suatu hari bisa mengerti kg.. amieeenn :)

heheh, maklum kak masih nubi T__T

hehe...yg penting tetap semangat bang ...hahayyy

Info yang sangat bermanfaat sekali kang, makasih kunjungannya

Keren juga ya sob tampilannya,,,,tq sudah berbagi!

izin download gan untuk belajar...


Emoticon Emoticon