Вы находитесь на странице: 1из 4

Cara Membuat Form Login Sederhana

Pada Pemrograman PHP


Oktober 2, 2016 Ardy Sendleep 2 Comments css, pemrograman, php, program
http://www.serbabebaas.com/cara-membuat-program-form-login-menggunakan-javanetbeans/

Form login biasanya terdapat pada tampilan awal pada program aplikasi maupun
website. Penggunaan form login diperlukan untuk menjaga keamanan sistem pada
aplikasi maupun website yang dibuat. Form login hanya dapat diakses atau dibuka
oleh pemilik, hal ini dilakukan untuk meminimilisir orang yang tidak bertanggung
jawab dapat mengaksesnya. Pada form login, pengguna diminta untuk memasukan
username dan password. Bila username dan password tidak sesuai maka program
tidak muncul atau tampil, pengguna perlu melakukan login kembali. Terkadang untuk
meningkatkan keamanan, pemilik bisa menerapkan sistem kemananan yang lebih
protektif, misalnya: bila melakukan kesalahan sebanyak 3 kali, pengguna tidak dapat
melakukan login hingga beberapa jam. Berbicara mengenai form login, Kami ingin
berbagi informasi mengenai pembuatan form login sederhana menggunakan bahasa
pemrograman PHP. Untuk lebih jelasnya, berikut ini cara pembuatan program
tersebut:
1.
Buat
file
PHP
Untuk membuat file PHP, Anda dapat menggunakan software editor text salah satunya
Notepad++. Jalankan Notepad++ dan buat file baru dengan cara memilih File > New
dan simpan dengan tipe ekstensi .php. Simpan file PHP pada Local Disk > xampp >
htdocs > buat folder baru untuk menyimpan file php. Buat script pemrograman
php seperti berikut ini.
a. Script login.php untuk tampilan awal ketika login username dan password.
<html>
<head>
<title>form login</title>
<link href="style/style.css" rel="stylesheet" type="text/css" media="screen"/>
</head>
<body>
<form action="proseslogin.php" method="post" name="form1">
<table>
<tr id="header">
<td colspan="2"><h2>Login Disini</h2></td>
</tr>

<tr>
<td>Username</td>
<td><input type="text" name="username"
id="username" placeholder="username"></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password"
id="password" placeholder="password"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type="submit" name="Login"
value="Login">
<input type="reset" name="reset"
value="Reset"></td>
</tr>
</table>
</form>
</body>
</html>
b. Script proseslogin.php untuk menampilkan hasil login berhasil maupun login
gagal.
<html>
<head>
<title>Hasil Login</title>
<link rel="stylesheet" type="text/css" href="style/style.css">
</head>
<body>
<form action="proseslogin.php" method="post" name="form1">
<table>
<tr>
<td>
<?php
if (isset($_POST['Login'])){
$login = $_POST['username'];
$pass = $_POST['password'];
if ($login == "serbabebas" && $pass ==
"serbabebas"){
echo "<h2>Login Berhasil</h2>";
} else{
echo "<h2>Login Gagal</h2>";
}
}
?>
</td>

</tr>
</table>
</form>
</body>
</html>
2. Buat file CSS
Desain form login menggunakan bahasa tampilan CSS. Buat file css menggunakan
Notepad++ dengan memilih File > New dan simpan dengan nama style.css. Berikut
ini contoh script file style.css yang telah selesai dibuat.
body{
background:url(../images/background2.png);
font-family: arial;
}
table {
width:350px;
margin:100px auto;
padding:20px 40px;
border:1px solid #ccc;
background:rgba(255, 255, 255, 0.77);
border-radius: 10px;
box-shadow: 0 0 10px #fff;
}
input[type="text"], input[type="password"]{
border:1px solid rgba(51,51,51,.5);
border-radius:10px;
padding: 5px;
font-size: 15px;
line-height: 20px;
width: 100%;
text-align:center;
}
input[type="submit"], input[type="reset"]{
margin-top: 15px;
font-size: 18px;
border:1px solid #000;
padding:5px 10px;
border:1px solid rgba(51,51,51,.5);
border-radius:10px;
box-shadow: 2px 1px 1px #aaa;
cursor:pointer;
}
input[type="submit"]:hover, input[type="reset"]:hover{
background:#f4f4f4;

}
h2 {
text-align: center;
}
table tr td {
margin:10px 5px;
padding:5px 0;
line-height: 30px;
}

3. Cek hasil program


Anda dapat mengecek hasil program dengan menggunakan software browser salah
satunya Mozilla Firefox. Jalankan browser dan ketik pada address url, seperti:
http://localhost/nama folder/nama file.php. Pada program tersebut, pengguna
diminta melakukan input username dan password. Bila data diisi dengan benar maka
akan tampil laporan login berhasil. Sedangkan bila username dan password salah
maka akan tampil laporan login gagal.

Вам также может понравиться