PHP Login Form: Guide to Create a Login Form in PHP
Step 1- Create a HTML PHP Login Form
To create a login form, follow the steps mentioned below:
- Open Microsoft Visual Studio -> create a new file and name it as an SL file
- Now, on a page, write the code mentioned in the example below
- The HTML program will create a webpage form that will allow users to log in themselves
The code consists of HTML elements. The basic elements are:
<title>
The element displays the heading of the document. The label can be only in the text format, and it shows the text in the browser's tab.
<link>
It creates a link between the working document and an external resource.
<form>
The element defines the user input included while creating an HTML.
<input type>
It displays a one-line input field.
<label>
It defines a label for many form elements. It majorly indicates the radio button/checkbox.
<!DOCTYPE html>
<html>
<head>
<title>LOGIN</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<form action="login.php" method="post">
<h2>LOGIN</h2>
<?php if (isset($_GET['error'])) { ?>
<p class="error"><?php echo $_GET['error']; ?></p>
<?php } ?>
<label>User Name</label>
<input type="text" name="uname" placeholder="User Name"><br>
<label>Password</label>
<input type="password" name="password" placeholder="Password"><br>
<button type="submit">Login</button>
</form>
</body>
</html>
Step 3: Create a Database Table Using MySQL
When you create a database, you're creating a structure like this:
Name | Password |
Chandler | Monika@123 |
Ross | Rachel@123 |
Now, start your SQL Xampp server and select admin. This will direct you to the phpMyAdmin webpage. Now, log in with your username and password.
Now, on the MyPHPAdmin, create a new database by clicking "New" on the left-hand side of a webpage.
Next, enter a name for the database where it says "Create database".
Then, you will be directed to the next page where you will create a new table. Now, enter the desired table name.
Next, you can select the desired type number for the ‘Fields’ text box.
Note: The fields are the columns; some of the fields are username, password, address, etc. In the text box, enter the number '4'. You can also increase the number based on the requirement.
Once you have completed the steps, click the Go button.
In the type space, select these options.
Next, set a primary key for the ID field by selecting the drop-down list option and select save.
Note: Suppose you receive a #1067 error in later versions of phpMyAdmin, change the Default drop-down list from TimeStamp to None.
Once you save this, you will be directed to the structure screen.
This should be the final output:
Step 4: Open a Connection to a MySQL Database
Once you create a PHPMyAdmin database, your next step is to write a code on Visual Studio.
Go to Microsoft visual code -> create a new file and name it as DB connection.
Now, in the code below, you will notice the function mysqli_connect( ). As the name suggests, it does the same task. It connects the database to the form that was created.
<?php
$sname= "localhost";
$unmae= "root";
$password = "";
$db_name = "test_db";
$conn = mysqli_connect($sname, $unmae, $password, $db_name);
if (!$conn) {
echo "Connection failed!";
}
This demo has used an if statement to check whether the code is working or not. A suitable message is printed, depending on if the database was found.
Now, execute the below SQL query to create the user table within your MySQL database.
<?php
session_start();
include "db_conn.php";
if (isset($_POST['uname']) && isset($_POST['password'])) {
function validate($data){
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
$uname = validate($_POST['uname']);
$pass = validate($_POST['password']);
if (empty($uname)) {
header("Location: index.php?error=User Name is required");
exit();
}else if(empty($pass)){
header("Location: index.php?error=Password is required");
exit();
}else{
$sql = "SELECT * FROM users WHERE user_name='$uname' AND password='$pass'";
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) === 1) {
$row = mysqli_fetch_assoc($result);
if ($row['user_name'] === $uname && $row['password'] === $pass) {
echo "Logged in!";
$_SESSION['user_name'] = $row['user_name'];
$_SESSION['name'] = $row['name'];
$_SESSION['id'] = $row['id'];
header("Location: home.php");
exit();
}else{
header("Location: index.php?error=Incorect User name or password");
exit();
}
}else{
header("Location: index.php?error=Incorect User name or password");
exit();
}
}
}else{
header("Location: index.php");
exit();
}
Now, if you log in using the wrong credentials, you will get the following output
Step 5 - Create a Logout Session
In this section, you will create a "logout.php" file.
When a user selects the logout option, the code mentioned below will automatically redirect the user back to the login page.
<?php
session_start();
session_unset();
session_destroy();
header("Location: index.php");
Step 6 - Create a Code for the Home Page
Next, this tutorial will show you how to get back to the home page.
The code for the home page is:
<?php
session_start();
if (isset($_SESSION['id']) && isset($_SESSION['user_name'])) {
?>
<!DOCTYPE html>
<html>
<head>
<title>HOME</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Hello, <?php echo $_SESSION['name']; ?></h1>
<a href="logout.php">Logout</a>
</body>
</html>
<?php
}else{
header("Location: index.php");
exit();
}
?>