Template Userman Mikrotik ~ Catatan Kecil

Template Userman Mikrotik

Pada posting kali ini akan saya berbagi design template userman mikrotik, untuk memperindah mikrotik hotspot

Berikut langkah - langkah untuk membuat template userman anda sendiri:

Login Dashboard Userman

Login ke usermanager mikrotik dengan url http://IP-ANDA/userman, bila sudah login pilih ke menu Setting lalu pilih template.

Dashboard Userman

customize userman voucher

Setelah masuk di tab template userman, sebaiknya kita buat profil baru untuk HTML yang nanti akan kita tambahkan sehingga template userman default mikrotik masih tetap bisa dipakai jika nanti diperlukan.

Caranya ketik tombol + pada kolom NAME setelah muncul popup windows masukan nama yang akan dibuat lalu klik Create.

Menambah Template Userman

Oke jika sudah, kita buka profil yang telah dibuat dengan meng-klik tombol panah lalu pilih nama yang tadi sudah dibuat. Lalu pastekan HTML dibawah ini.

Paste kan di kolom Header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt
<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
<title>Vouchers</title>
<style> @media print {   .noprint {     display: none;   }   .pagebreak {     page-break-after: always;   } } </style>
</head>

Paste di kolom Row

<table align="left" width="10%" style="margin-top: 1%;">
<tr class="space1">
<td colspan="3"></td></tr>
<tr>
<td align="left" valign="middle">
<table width="180" height="205" style="border: 2px solid #000000; padding: 0px;" cellpadding="0" cellspacing="0" bgcolor="#666666"> 
<tr><td height="56" align="center" valign="baseline">
<font style="color:#FFF" size="+2">Novotel Bogor</font>
<font style="color:#FFF" size="-1"><p><i>Hotspot Voucher</i></p></font>
<tr>
<td align="center" valign="bottom" height="60" colspan="2">
<table width="100" style="background-color: #330" bordercolor="#000000">
<tr><td align="right"><font style="color:#FFF">Login</b></font></td> 
<td><input style="width: 80px" name="username" type="text" value="%u_username%"/></td>
<tr><td align="right"><font style="color:#FFF"><b>Password</b></font></td>
<td><input style="width: 80px" name="password" type="text" value="%u_password%"></td>
</tr></table></td></tr>
<tr>
<td height="52" align="center" valign="middle"><img src="http://i42.tinypic.com/5pflhi.png"/></td></tr>
<tr>
<td height="28" align="center" valign="middle"><font style="color:#FFF" size="-4">Copyright 2013 Prime-technology</font></td></tr>
</table></td></tr></table>

Paste di kolom Footer

</body></html>

Paste dikolom BREAK

<p class="noprint" style="font-size: 10px">   ................ page break ................ </p> <p class="pagebreak">&nbsp;</p>

LIHAT GAMBAR..

html userman mikrotik

Setelah semua kode di paste ke kolom template userman klik save untuk menyimpan kode html userman yang sudah dibuat. Sampai disini template userman mikrotik siap di generate voucher.

Untuk generate voucher mikrotik pilih menu user dan pilih voucher yang mau di print lalu klik generate dan pilih nama profil template userman yang sebelumnya sudah dibuatbuat.

generate voucher userman

Jangan lupa di edit dan disesuaikan kode html nya sesuai dengan kebutuhan template userman mikrotik ditempat anda, template userman bisa di edit menggunakan editor seperti notepad++ atau sublime. untuk saya sendiri lebih nyaman menggunakan sublime

Tampilan template userman

voucher template userman

Template userman hasil generate voucher mikrotik yang sudah dibuat bisa langsung di print melalui browser atau di simpan terlebih dahulu di komputer / laptop anda.

Catatan Kecil

Media sharing dan saling berbagi ilmu!!!

Minggu, 11 Agustus 2013