Rabu, 28 Maret 2018

Tutorial Membuat Tampilan Login Pada HTML


Cara kita membuat Tampilan Login Pada HTML
Disini saya akan membaut tampilan login sederhana, jadi kalian bisa melihat sourcode dibawah ini :


  • Sourcode :
         INDEX.PHP


<<?php
session_start();
ini_set('display_errors',0);
if($_SESSION["SALAH"]>=3){
    echo '<h1>Anda dalam kondisi diBlokir</h1>';
    exit();
}
?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Login Kita</title>
        <link rel="icon" href="asset/images/favicon.ico">
        <link rel="stylesheet" href="asset/css/bootstrap.css">
        <link rel="stylesheet" href="asset/css/floating-labels.css">
        
        <script>
        function Hello(){
        var email=document.getElementById("email").value;
        var password=document.getElementById("password").value;
        
            if (email=="admin@gmail.com" && password=="admin123"){
            alert("Hello...Anda BERHASIL Masuk Login");
            }
            else{
            alert("ANDA TIDAK BERHASIL LOGIN SALAH EMAIL/PASSWORD");
            }
        };
        </script>
    </head>
    <body>
        <form id="frm01" action="login.php" method="POST" class="form-signin">
            <div class="text-center mb-4">
                <img class="mb-4" width="72" height="72" src="asset/images/bootstrap-solid.svg">
                <h1>Login Kita</h1>
                <p>Ayookkk Login Untuk Masuk...!!!</p>
                <p>Salah Login 3 KALI Anda Di Blokir</p>
            </div>
            <div class="form-label-group">
                <input class="form-control"
                       type="email"
                       name="email"
                       id="email" 
                       placeholder="Email Address" 
                       required="email" 
                       autofocus="yes" 
                       autocomplete="no"
                       maxlength="30">
                       
                <label for="email">Email Anda</label>
            </div>
            <div class="form-label-group">
                <input class="form-control"
                       type="password"
                       name="password"
                       id="password" 
                       placeholder="password" 
                       required="yes" 
                     
                       autocomplete="no"
                       maxlength="8">
                <label for="password">Password</label>
            </div>
            <div class="checkbox mb-4">
                <label>
                    <input type="checkbox"> Remember Me
                </label>
            </div>
            <button onclick="Hello()]" class="btn-lg btn-success btn-block" type="submit">Sign in</button>
            <button class="btn-lg btn-primary btn-block" type="button">Forget Password</button>
        </form>
        
    </body>
</html>


      LOGIN.php

<?php
session_start();
$user = $_POST["email"];
$pass = $_POST["password"];
//==============================
$dbuser = "admin@gmail.com";
$dbpass = "admin123";
//==============================
if($user == $dbuser && $pass == $dbpass){
    echo '<h1>SELAMAT DATANG DI WEBSITE KAMI</h1>';
} else {
    $_SESSION["SALAH"]++;
    header("location:index.php");
}






  • Hasil Tampilan Login


Tidak ada komentar:

Posting Komentar