Pada latihan ini, kita membuat 6 file, yaitu:
1. indeks.php
2. login.php
3. logout.php
4. profile.php
5. session.php
6. style.css
Selengkapnya seperti ini:
1. indeks.php
<?php
include('login.php'); // Memasuk-kan skrip Login
if(isset($_SESSION['login_user'])){
header("location: profile.php");
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Form Login</title>
<!-- Skrip CSS -->
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<div class="container">
<div class="main">
<form action="" method="post">
<h2>STMIK JABAR</h2><hr/>
<label>Username :</label>
<input id="name" name="username" placeholder="username" type="text">
<label>Password :</label>
<input id="password" name="password" placeholder="**********" type="password">
<input type="submit" name="submit" id="submit" value="Login">
</form>
</div>
</div>
</body>
</html>
****
2. login.php
<?php
session_start(); // Memulai Session
$error=''; // Variabel untuk menyimpan pesan error
if (isset($_POST['submit'])) {
if (empty($_POST['username']) || empty($_POST['password'])) {
$error = "Username or Password is invalid";
}
else
{
// Variabel username dan password
$username=$_POST['username'];
$password=$_POST['password'];
// Membangun koneksi ke database
$connection = mysql_connect("localhost", "root", "");
// Mencegah MySQL injection
$username = stripslashes($username);
$password = stripslashes($password);
$username = mysql_real_escape_string($username);
$password = mysql_real_escape_string($password);
// Seleksi Database
$db = mysql_select_db("stmikj", $connection);
// SQL query untuk memeriksa apakah karyawan terdapat di database?
$query = mysql_query("select * from karyawan where pass_karyawan='$password' AND user_karyawan='$username'", $connection);
$rows = mysql_num_rows($query);
if ($rows == 1) {
$_SESSION['login_user']=$username; // Membuat Sesi/session
header("location: profile.php"); // Mengarahkan ke halaman profil
} else {
$error = "Username atau Password belum terdaftar";
}
mysql_close($connection); // Menutup koneksi
}
}
?>
****
3. logout.php
<?php
session_start();
if(session_destroy()) // Menghapus Sessions
{
header("Location: indeks.php"); // Langsung mengarah ke Home index.php
}
?>
****
4. profile.php
<?php
include('session.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Profile Karyawan</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="profile">
<b id="welcome">Selamat Datang : <i><?php echo $login_session; ?></i></b>
<b id="logout"><a href="logout.php">Log Out</a></b>
</div>
</body>
</html>
****
5. session.php
<?php
// Membangun Koneksi dengan Server dengan nama server, user_id dan password sebagai parameter
$connection = mysql_connect("localhost", "root", "");
// Seleksi Database
$db = mysql_select_db("stmikj", $connection);
session_start();// Memulai Session
// Menyimpan Session
$user_check=$_SESSION['login_user'];
// Ambil nama karyawan berdasarkan username karyawan dengan mysql_fetch_assoc
$ses_sql=mysql_query("select nama_karyawan from karyawan where user_karyawan='$user_check'", $connection);
$row = mysql_fetch_assoc($ses_sql);
$login_session =$row['nama_karyawan'];
if(!isset($login_session)){
mysql_close($connection); // Menutup koneksi
header('Location: indeks.php'); // Mengarahkan ke Home Page
}
?>
****
6. style.css
.container {
width: 50%;
margin: 0 auto;
}
h2{
background-color: #53bd84;
padding: 30px 35px;
margin: -10px -50px;
text-align:center;
color: #fff;
}
span{
display: block;
margin-bottom: 20px;
color: red;
}
.success{
display: block;
margin-top: 20px;
margin-bottom: 0;
font-size: 14px;
}
b{
color:green;
}
hr{
margin: 10px -50px;
border: 0;
border-top: 1px solid #ccc;
margin-bottom: 25px;
}
div.main{
width: 306px;
padding: 10px 50px 30px;
border: 2px solid gray;
font-family: raleway;
float:left;
margin-top:15px;
}
input[type=text]{
width: 96%;
height: 25px;
padding: 5px;
margin-bottom: 25px;
margin-top: 5px;
border: 2px solid #ccc;
color: #53bd84;
font-size: 16px;
}
input[type=password]{
width: 96%;
height: 25px;
padding: 5px;
margin-bottom: 25px;
margin-top: 5px;
border: 2px solid #ccc;
color: #53bd84;
font-size: 16px;
}
label{
color: #53bd84;
text-shadow: 0 1px 0 #fff;
font-size: 14px;
font-weight: bold;
}
input[type=submit]{
font-size: 16px;
background: linear-gradient(#53bd84 5%, #fff 100%);
color: #4E4D4B;
font-weight: bold;
cursor: pointer;
width: 100%;
padding: 10px 0;
outline:none;
}
#profile {
padding:50px;
border:1px solid grey;
font-size:20px;
background-color:#A2DED0;
}
#logout {
float:right;
padding:5px;
border:dashed 1px gray
}
a {
text-decoration:none;
color:#6495ed
}
i {
color:#6495ed
}
*Catatan:
a. Untuk file style.css, silakan copy-paste saja agar jari-jari tidak keriting.hehehe
b. Jangan lupa buat juga tabel di MYSQL yaaa! Nama dan Field Name-nya, silakan lihat script di atas!
========
Selesai.
Sumber: nyekrip.com/cara-membuat-form-login-dengan-php-mysql
Contoh tampilan, tabel mysql dan penjelasannya ada di nyekrip.com. Kereeen!
