Skip to content Skip to sidebar Skip to footer

Cara Membuat Login Multi User dengan PHP, MySQL dan Bootstrap

Cara Membuat Login Multi User dengan PHP, MySQL dan Bootstrap - Login Multi User digunakan pada sebuah web untuk membedakan hak akses user.

Contohnya disini adalah website sekolah yang terdiri dari tiga user yaitu admin, guru dan siswa. Masing-masing user memiliki hak akses yang berbeda maka harus dibuatkan form login multi user.
form login ini hanya ada satu yang dapat digunakan dan diakses oleh ketiga user tersebut di atas.


Sebelumnya kita harus membuat database yang memiliki 3 tabel yaitu admin, guru dan siswa. 
1. Tabel admin terdiri dari field email dan password


2. Tabel guru terdiri dari field nip, nama, alamat, email, password


3. Tabel siswa terdiri dari field nis, nama, alamat, email, password



4. Setelah membuat ketiga tabel tersebut kita langsung membuat form login. Buat file dengan nama index.html dan masukkan code berikut :

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Bootstrap Login Form</title>
<meta name="generator" content="Bootply" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<!--login modal-->
<div id="loginModal" class="modal show" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog">
  <div class="modal-content">
      <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
          <h1 class="text-center">Login</h1>
      </div>
      <div class="modal-body">
          <form class="form col-md-12 center-block" action="proses.php" method="post">
            <div class="form-group">
              <input type="text" class="form-control input-lg" placeholder="Email" id="email" name="email">
            </div>
            <div class="form-group">
              <input type="password" class="form-control input-lg" placeholder="Password" id="password" name="password" >
            </div>
            <div class="form-group">
              <select class="form-control input-lg" placeholder="Password" id="akses" name="akses" >
              <option value="admin"> ADMIN </option>
                <option value="guru"> GURU </option>
                <option value="siswa"> SISWA </option>
              </select>
            </div>
            <div class="form-group">
              <button class="btn btn-primary btn-lg btn-block">Sign In</button>
              <span class="pull-right"><a href="#">Register</a></span><span><a href="#">Need help?</a></span>
            </div>
          </form>
      </div>
      <div class="modal-footer">
          <div class="col-md-12">
          <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
 </div>
      </div>
  </div>
  </div>
</div>
<!-- script references -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>

5. Buat file lagi dengan nama proses.php dan masukkan code berikut :

<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Bootstrap Login Form</title>
<meta name="generator" content="Bootply" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<?php
$konek=mysql_connect('localhost','root','') or die('server down') ;
mysql_select_db('login',$konek) ;
  $user = $_POST['email'];
  $password = $_POST['password'];
$akses=$_POST['akses'];

 

  if ($akses == "admin"){
$sql = "SELECT * FROM admin WHERE email='$user' AND password='$password'";
  $query = mysql_query($sql,$konek);
  $row = mysql_num_rows($query);
if ($row == 1){
  echo"<div align='center'><h1>Ini Halaman Admin</h1></div>";
}else{
echo"<div align='center'><h1>Login Gagal</h1></div>";
}
}
elseif ($akses == "guru"){
$sql = "SELECT * FROM guru WHERE email='$user' AND password='$password'";
  $query = mysql_query($sql,$konek);
  $row = mysql_num_rows($query);
  if ($row == 1){
  echo"<div align='center'><h1>Ini Halaman Guru</h1></div>";
}else{
echo"<div align='center'><h1>Login Gagal</h1></div>";
}
}
elseif($akses == "siswa"){
$sql = "SELECT * FROM siswa WHERE email='$user' AND password='$password'";
  $query = mysql_query($sql,$konek);
  $row = mysql_num_rows($query);
  if ($row == 1){
  echo"<div align='center'><h1>Ini Halaman Siswa</h1></div>";
}else{
echo"<div align='center'><h1>Login Gagal</h1></div>";
}
}
?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>

6. Simpan dan Jalankan.

Hasilnya seperti gambar berikut :







Download full source code di bawah ini :


Demikian Cara Membuat Login Multi User dengan PHP, MySQL dan Bootstrap. Semoga bermanfaat dan terimakasih

1 comment for "Cara Membuat Login Multi User dengan PHP, MySQL dan Bootstrap"