Skip to content Skip to sidebar Skip to footer

Membuat Login Multi User dengan PHP

Fungsi dari Login sendiri adalah untuk membedakan antara admin, operator dan user, jadi login dalam sebuah program maupun website tidak sekedar hanya sebuah hiasan, akan tetapi juga berperan sangat penting dalam sebuah program, jadi program tanpa login maka program tersebut tidak akan jalan.
Login Multi User
Nah, pada tutorial kali ini saya akan memberikan bagaimana cara membuat Login dengan Multi User dengan Desain yang keren, oke langsung saja kita mulai tutorialnya.

Langkah-langkah Pembuatan Login Multi User


1). Buat Foldernya terlebih dahulu, di dalam folder C: > xampp > htdocs. setelah itu buat foldernya dengan nama sesuka kalian, sebagai contoh saya beri nama Login_PHP.
usahakan jangan diberi spasi, kalian bisa gabungkan kata satu dengan yang lainnya, atau gabung kata satu dengan yang lainnya dengan garis bawah atau underscor (_). 

2). Buka Web Editor kalian, bisa Notepad++, Sublime Text 3 ataupun yang lain.

3). Setelah itu, buat file-filenya, untuk yang pertama kita buat tampilan utamanya yaitu login. kita buat tampilan loginnya dengan nama login.php, copy source code dibawah ini.

PHP
<?php
@session_start();
include "inc/koneksi.php";

if(@$_SESSION['admin'] || @$_SESSION['operator']) {
    header("location: index.php");
} else if (@$_SESSION['user']) {
    header("location: user/index.php");
} else{
?>

<!doctpe html>
    <html>
        <head>
            <title>Halaman Login</title>
        <style type="text/css">
        body {
            font-family: arial;
            font-size: 14px;
            background-color: #222;
        }
        #utama {
            width: 300px;
            margin: 0 auto;
            margin-top: 12%;
        }
        #judul {
            padding: 15px;
            text-align: center;
            color: #fff;
            font-size: 20px;
            background-color: #339966;
            border-top-right-radius: 10px;
            border-top-left-radius: 10px;
            border-bottom: 3px solid #336666;
        }
        #inputan {
            background-color: #ccc;
            padding: 20px;
            padding-bottom: 50px;
            border-bottom-right-radius: 10px;
            border-bottom-left-radius: 10px;
        }
        input {
            padding: 10px;
            border: 0px;
        }
        .lg {
            width: 260px;
        }
        .btn {
            background-color: #339966;
            border-radius: 10px;
            color: #fff;
        }
        .btn:hover {
            background-color: #336666;
            cursor: pointer;
        }
        </style>
        </head>
            <body>
           
            <div id="utama">
                <div id="judul">
                    Halaman Login
                </div>
               
                <div id="inputan">
                <form action="" method="post">
                    <div>
                        <input type="text" name="user" placeholder="Username" class="lg">
                    </div>
                    <div style="margin-top: 10px;">
                        <input type="password" name="pass" placeholder="Password" class="lg">
                    </div>
                    <div style="margin-top: 10px;">
                        <input type="submit" name="login" value="login" class="btn" style="float: left;">
                        <a href="register.php" style="color: #000;"><p style="float: right; font-size: 12px;">Register?</p></a>
                    </div>
                </form>
               
                <?php
                $user = @$_POST['user'];
                $pass = @$_POST['pass'];
                $login = @$_POST['login'];
               
                if($login) {
                    if($user == "" || $pass == "") {
                        ?> <script type="text/javascript">alert("Username / Password tidak boleh kosong");</script><?php
                    }else{
                        $sql = mysql_query("select * from db_login where username = '$user' and password = ('$pass')") or die (mysql_error());
                        $data = mysql_fetch_array($sql);
                        $cek = mysql_num_rows($sql);
                        if($cek >= 1) {
                            if($data['level'] == "admin") {
                                @$_SESSION['admin'] = $data['kode_user'];
                                header("location: index.php");
                            } else if($data['level'] == "operator") {
                                @$_SESSION['operator'] = $data['kode_user'];
                                header("location: operator/index.php");
                            } else if($data['level'] == "user") {
                                @$_SESSION['user'] = $data['kode_user'];
                                header("location: user/index.php");
                            }
                        } else {
                            echo "login gagal";
                        }
                    }
                }
                ?>
                </div>
            </div>
</body>
    </html>
   
    <?php
    }
    ?>

4). Kita buat tampilan sederhana websitenya, terserah kalian mau tampilan seperti apa, sebagai contoh percobaan, kita buat tampilannya hanya dengan tulisan SELAMAT DATANG.

Setelah source code diatas kalian simpan, kalian buka web browsernya, sebelum itu buka xampp nya terlebih dahulu, kemudian start Apache dan MySQLnya. 

setelah itu kita buka tampilan loginnya dengan penulisan URL localhost > Login_PHP.
Penjelasan source code login.php :

PHP
if($data['level'] == "admin") {    @$_SESSION['admin'] = $data['kode_user'];
     header("location: index.php");
} else if($data['level'] == "operator") {
     @$_SESSION['operator'] = $data['kode_user'];
      header("location: operator/index.php");
} else if($data['level'] == "user") {
     @$_SESSION['user'] = $data['kode_user'];
      header("location: user/index.php");
}

Keterangan : 
Warna Merah : melakukan eksekusi pada inputan login, apabila inputan berlevel admin, maka login akan membuka tampilan index.php.

Warna Biru : melakukan eksekusi pada inputan login, apabila inputan berlevel operator, maka login akan membuka tampilan operator/index.php.

Warna Orange : melakukan eksekusi pada inputan login, apabila inputan berlevel user, maka login akan membuka tampilan user/index.php.

Setelah itu, buat folder inc, kemudian buat file-file berikut.

copy source code dibawah ini, kemudin beri nama koneksi.php

PHP
<?php
mysql_connect("localhost","root","") or die (mysql_error());
mysql_select_db("db_login") or die (mysql_error());
?>

untuk db_login, sesuaikan dengan database yang sudah kalian buat.

kemudian, copy source code dibawah ini kemudian berinama logout.php 

PHP
<?php
@session_start();
session_destroy();
header("location: /Belajar_PHP/Login_PHP/login.php");
?>

Untuk header("location: /Login_PHP/login.php"); letak folder kita, atau folder yang akan ditampilkan oleh logout.php
Lalu, bagaimana cara kita membedakan antara Login Admin, Operator dengan User..?
Pastinya kalian bertanya seperti itu kan..? oke, langsung saja, saya jelaskan secara detail bagaimana cara membedakan antara login admin, operator dengan user.


Membedakan Login Admin, Operator dan User


1). Langkah pertama, kalian buat tampilan website pertama sederhana saja, dengan kata SELAMAT DATANG, namun tampilannya kalian bagi menjadi 3 tampilan yaitu, 1 didalam folder utama dengan nama Login_PHP, dan yang kedua didalam folder admin dengan nama index.php dan yang terakhir didalam folder operator dengan format file index.php, dan strukturnya akan nampak seperti pada gambar dibawah ini :
Membuat Login Multi User dengan PHP
Langkah Pertama - Membuat Login Multi User dengan PHP 

2). setelah itu, masukkan source code dibawah ini pada masing-masing tampilan awal website kalian :

PHP
<?php
@session_start();
include "inc/koneksi.php";

if(@$_SESSION['user']) {
?>

dan jangan lupa, letakkan source code dibawah ini pada bagian akhir tag penutup </html> :

PHP
<?php
} else {
header("location: login.php");
}
?>

dan tampilannya akan nampak seperti pada gambar Nomer 1 diatas

Keterangan :
Untuk yang saya kasih garis biru bisa kalian rubah sesuai dengan letak atau login pada masing-masing level yang sudah kalian tentukan

Untuk yang berwarna orange, apabila peletakan folder index.php kalian berada pada bagian dalam folder, maka kalian tinggal menambahkan ../ jadi penulisannya ../login.php, dan cara ini berlaku untuk sub folder.

Sekian tutorial dari saya, apabila kalian masih bingung, atau mengalami kesulitan, atau tidak faham dengan apa yang saya jelaskna diatas, silahkan kalian dapat meninggalkan komentar pada bagian kolom komentar dibawah ini, atau juga bisa kirim email kalian dengan cara klik tombol contact pada bagian footer (bagian bawah sendiri pada website) isi biodata secara benar dan lengkap.

Post a Comment for "Membuat Login Multi User dengan PHP"

Berlangganan via Email