Cara Ganti Template Error Web Proxy Mikrotik RouterOS

Template Html Error Web Proxy Mikrotik RouterOS
YOUSHE.ID - Halo sobat youshe, kali ini saya akan memberikan sebuat html css yang cocok di pasang web proxy untuk peringatan tau pemberiberitahuan kepada user yang telat membayar tagihan wifi internet. Tampilannya sangat sederhana namun mudah untuk dipahamin user dan ini pernah saya praktekan sendiri buat pelanggan wifi saya hasinya sangat manjur jika halaman ini sudah muncul di hp maupun laptop pelanggan yang artinya dia telat bayar tagihan wifi yang pernah saya alami pelanggan akan segera konfirmasi untuk melakukan pembayaran / datang langsung menemui buat pembayaran tagihan wifi.
Berikut ini Script Template Html Error Web Proxy Mikrotik RouterOS yang bisa di edit sesuai selera dan kemauan anda lalu simpan dengan nama error.html
<!DOCTYPE html> <html> <link rel="icon" href="https://wms.wifi.id/assets/img/favicon.ico"> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <title>PEMBERITAHUAN</title> <style>body{margin:0;text-align:center;padding:8% 0;background-color:#000;font-family:montserrat,sans-serif;font-weight:700;color:#fff;ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}.block{position:relative;margin:0 auto;width:80%;max-height:250px;background:linear-gradient(0deg,#000,#272727);font-size:2.5vw;line-height:1.5;padding:5px 10px}.block:before,.block:after{content:'';position:absolute;left:-2px;top:-2px;background:linear-gradient(45deg,#fb0094,#00f,#0f0,#ff0,red,#fb0094,#00f,#0f0,#ff0,red);background-size:400%;width:calc(100% + 4px);height:calc(100% + 4px);z-index:-1;animation:steam 20s linear infinite}@keyframes steam{0%{background-position:0 0}50%{background-position:400% 0}100%{background-position:0 0}}.block:after{filter:blur(50px)}</style> <body> <div style='font-size:5vw;text-align: center;'>INFO!</div> <br> <div class="block">Pelanggan yang terhormat,<br>Di mohon untuk melakukan pembayaran sebelum akhir bulan<br> <br>Terima Kasih <br>YOUSHE</div> <br> <p style='font-size:2vw;line-height:2.0;'> <span class="typed-text"> </span> <span class="cursor">&nbsp;</span> </p> </div> <script>const typedTextSpan=document.querySelector(".typed-text"),cursorSpan=document.querySelector(".cursor"),textArray=["WhatsApp: +62 8586-7271-777","Perum Loh Agung 6 Ruko A1"],typingDelay=200,erasingDelay=100,newTextDelay=2e3;let textArrayIndex=0,charIndex=0;function type(){charIndex<textArray[textArrayIndex].length?(cursorSpan.classList.contains("typing")||cursorSpan.classList.add("typing"),typedTextSpan.textContent+=textArray[textArrayIndex].charAt(charIndex),charIndex++,setTimeout(type,typingDelay)):(cursorSpan.classList.remove("typing"),setTimeout(erase,newTextDelay))}function erase(){0<charIndex?(cursorSpan.classList.contains("typing")||cursorSpan.classList.add("typing"),typedTextSpan.textContent=textArray[textArrayIndex].substring(0,charIndex-1),charIndex--,setTimeout(erase,erasingDelay)):(cursorSpan.classList.remove("typing"),textArrayIndex++,textArrayIndex>=textArray.length&&(textArrayIndex=0),setTimeout(type,typingDelay+1100))}document.addEventListener("DOMContentLoaded",function(){textArray.length&&setTimeout(type,newTextDelay+250)});</script> </body> </html>
Dimana script ini kita pasang? tentunya kita harus terlebih dahulu mengaktifkan web proxy kemudian kita taruh pada directorat flash/webproxy/error.html contoh seperti gambar berikut ini
Template Html Error Web Proxy Mikrotik RouterOS
Untuk membuat web proxy sebenarnya sangat mudah, dan langkah-langkah membuat web proxy di mikrotik diantaranya adalah sebagai berikut:
1. Masuk ke winbox
2. Pilih menu IP lalu klik Web Proxy
3. Dibagian General
- Anda wajib centang pada plihan enable
- Di bagian port silahkan isi dengan angka yang nantinya akan di gunakan oleh proxy seperti contoh saya menggunakan port: 8080
- Cache Administrator, Max. Cache Size, Max Cache Object Size sesuaikan dengan kebuthan anda lalu dibagian Chace On Disk silahkan di centang
4. Apply
5. OK
Template Html Error Web Proxy Mikrotik RouterOS
Setelah langkah setting web proxy selesai yang perlu kita lakukan adalah proses redirect dan bisa kita setting melalu menu IP > Firewall > NAT
Template Html Error Web Proxy Mikrotik RouterOS
Setalah masuk di menu IP > Firewall > NAT > + lalu setting seperti ini:
1. Bagian General
2. Chain : dstnat
3. Protocol : 6 (tcp)
4. Dst : 80
5. Bagian action
6. Action : redirect
7 To Port : 8080
8. Apply
9. OK
10. Selesai
Template Html Error Web Proxy Mikrotik RouterOS
Sekarang Langkah penggantian template error pada web proxy pilih IP kemudian Web Proxy lalu tekan Reset HTML
Template Html Error Web Proxy Mikrotik RouterOS
Setalah itu pilih menu file lalu delete error.html dan gantikan dengan error.html yang tadi kalian simpan dari script di atas yang saya kasih. contoh directorat web proxy yang sudah kita delete atau tanpa ada error.html
Sekarang saya akan coba upload file yang sudah saya buat dengan script di atas dan tersimpan dengan format error.html
Template Html Error Web Proxy Mikrotik RouterOS
Bisa juga dengan cara drag drog tinggal buka folder lalu pilih error.html dan tekan mouse ditahan taruh di webproxy selesai
© YOUSHE. All rights reserved. YOUSHE V1.0