Minggu, 25 September 2016

Membuat Halaman Login Sederhana

Membuat halaman login bukanlah hal sulit, untuk membuat halaman login kita bisa memanfaatkan fungsi SESSION untuk mengolah proses login, misalnya saat login sukses atau berhasil maka  akan tercipta sebuah session yang mana digunakan sebagai pengaman. Karena user yang belum login tidak akan bisa mengakses sebuah halaman tanpa melakukan login terlebih dahulu .
Yang digunakan untuk pertama kali adalah membuat tabel database,disini saya menggunakan xampp untuk membuat database.
  • Membuat database.
  • Membuat tabel admin
  • Mengisi username dan password pada tabel yang telah dibuat

        Disini saya memakai akun admin dengan username dan password "admin"

  • Setelah database selesai dibuat, maka kita akan memulai dengan file2 yang dibutuhkan untuk membuat halaman login sederhana
    1.  Membuat Halaman Login
              
                     file login.php
              

               Source Code :
               <html>
               <head>
               <link rel="stylesheet" type="text/css" href="login.css">     
               </head>
               <body>
               <div id="head">LOGIN</div>
               <div id="footer">
               <form method="post" action="aksi.php">
               <input class="tengah" type="text" name="username"><br/>
                <input class="tengah" type="password"  name="password"><br/>
                <input id="tombol" type="submit" value="Login">
                </form></div>
                </body></html>

                 2.   Membuat Tampilan CSS,agar tampilan lebih menarik

                 file login.css

                 Source Code :
                 body{   background:#ECF0F1;
                 font-family: sans-serif;      }
                 #head{
         height: 35px;
         width: 300px;
         text-align: center;
         font-size: 15pt;
         padding-top:20px;
                 }
                 #footer{
         height: 200px;
         width: 300px;
                 }
                 .tengah{
         width: 250px;
         height:40px;
           margin-top:10px;
         margin-left: 60px;
         font-size: 12pt;
         border: 1px solid #2ECC71;
         padding-left:10px;
         color:#FFFFFF;
                 }
                 .tengah:focus{
         width: 250px;
         height:40px;
         margin-top:10px;
         margin-left: 60px;
         font-size: 12pt;
         padding-left:10px;
         color:#FF0000;
         outline: none;
         box-shadow: 0 0 5px #2ECC71;
                 }
                 #tombol{
         width: 200px;
         height:35px;
         margin-top:10px;
         margin-left: 60px;
         border:none;
         color:#fff;
         font-size: 14pt;
         outline:none;
         background-color: #FF0000;

                 3.   Membuat file php untuk menghubungkan ke database
                
                 file config.php
                
                 Source Code :
                 <?php
                // definisikan koneksi ke database
                $server = "localhost";
                $username = "root";
                $password = "";
                $database = "login";
                // Koneksi dan memilih database di server
                mysql_connect($server,$username,$password) or die("Koneksi gagal");
                mysql_select_db($database) or die("Database tidak bisa dibuka");
                ?>

                4. Membuat file php untuk menghubungkan file login dengan halaman utama

                file aksi.php

                Source Code :
                <?php
        session_start(); 
        include 'config.php'; 
        $username=$_POST['username']; 
        $password=$_POST['password']; 
        $query=mysql_query("select * from admin where username='$username' and                                               password='$password'");
        $z=mysql_num_rows($query);
        if($z==TRUE){ 
$_SESSION['username']=$username; 
header("location:index.php");   
        }else{   
echo "gagal login";
        }
                ?>

                5.  Membuat halaman utama
                file index.php

                Source Code :
                <?php
                session_start();
                if(empty($_SESSION['username'])){
                header("location:login.php");
                }
                echo "selamat datang ".$_SESSION['username'];
                ?>
                <br/><br/><br/><a href="logout.php">Logout</a>

                6. Membuat file logout
              
                Untuk mengeluarkan user dari halaman utama dan menghapus session, mengalihkan kembali                         kehalaman login.

                Source Code :
                <?php
                session_start();
                session_destroy();
                echo "<script>alert('Anda telah keluar dari halaman administrator'); window.location = 'login.php'</script>";
?>

              
Semoga tulisan tentang membuat halaman login sederhana dengan php ini bermanfaat bagi sobat-sobat.

Download Source disini


EmoticonEmoticon