Create login page in PHP using session?

In this tutorial you will learn how to create login page in php using session in very easy way. Here I will explain each and everything in step by step so that you can understand easily.

If you found any difficulty in my tutorial please post the comment in comment box or post in contact us page.

What we are doing in this tutorial?

Step 1.

First we will create a login page design in PHP so that we can login. My PHP page name is index.php.

Design your login page like below.

Copy the below complete HTML and CSS code and paste it in index.php page.


	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, intial-scale=1.0"/>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<title>Campuslife Login Page</title>
	<style>
	
		body{
			background: #ececec;
			color: #333;
		}
		#main{
			text-align: center;
			margin-top: 20px;
		}
	
		#main .login-box{
			margin-top: 20px;
		}
	
		#main .tb{
			width: 100%;
			height: 40px;
			margin-bottom: 5px;
			padding-left: 5px;
		}
	
		#main .btn{
			width: 100%;
			background: #AD193E;
			color: #f7f7f7;
		}
	
		#main .msg{
			color: red;
		}
	
	</style>
	</head>

	<body>
	<!-------------------Main Content------------------------------>
	<div class="container" id="main">
		<div class="col-sm-4"></div>
		<div class="col-sm-4">
			<h2>Login Page in PHP</h2>
			<form name="logfrm" action="login-details.php" method="post">
				<div class="col-sm-12 login-box">
					<input type="text" placeholder="Enter user name" name="user_name" class="tb" />
					<input type="text" placeholder="Enter password" name="password" class="tb" />
					<input type="submit" value="Login Now" name="login_btn" class="btn" />
				</div>
			</form>
			<div class="msg"><strong><?php echo $message; ?></strong></div>
		</div>
		<div class="col-sm-4"></div>
	</div>
	</body>
	</html>

Step 2.

Now create a database and table in MySQL. My database name is master and table name is login. You can give your own name to your database and table. To create the database in MySQL, go to in your MySQL and write the below command. Now execute your command by pressing Ctrl + Enter or you can execute it from tool bar.

Below is database command:

After creating the master database now we have to use that database. In that database we will create our table. See the below command to use the database and press Ctrl + Enter.

Now create the table in master database. See the below command to create a table.

Now database and table creation has been completed. Our table is empty and it’s time to insert the some records (user name and password) in table so that we can login from database using MySQL. Execute the below insert command in MySQL.

Step 3.

I am creating separate connection file so that I can access it anywhere in page. Now create a connection.php file. In this we will add connection information of MySQL so that we can create connection between PHP to MySQL for login.

Why separate connection file?

Because we can call that file in many pages. If we can’t create separate file for connection then we have to write same code in every pages manually. It is good for single or two pages, but not good for 10 or more pages.

Connection file contain below information like (host name, MySQL user name, MySQL password, database name). Change the connection information as your MySQL login information in connection.php file.

	
	$host ="localhost";
	$uname = "root";
	$pwd = '123456';
	$db_name = "master";
	

Now we will use connection.php file in step 4.

Step 4.

Now create a PHP login script page that allow to login us. My PHP login script page name is login.php.

Here we will add session_start() function to start the session.

Copy the below login script and paste it in your login.php page or write yourself for better practise by understanding it.

	
	<?php
	session_start();
	
	//this variable for show the error or success message on page
	$message="";

	if(isset($_POST['login_btn'])) 
	{	
		include "connection.php";

		$conn = mysqli_connect($host,$uname,$pwd) or die("Connection errors.".mysqli_error());
		mysqli_select_db($conn,$db_name);
		$result = mysqli_query($conn,"SELECT * FROM mukoo WHERE uname='" . $_POST["user_name"] . "' and pwd = '". $_POST["password"]."'");
		$row  = mysqli_fetch_array($result);
		if(is_array($row)) 
		{
			$_SESSION["user_name"] = $row[uname];
			$_SESSION["password"] = $row[pwd];
		}
		else 
		{
		$message = "Invalid Username or Password!";
		}

	}
	
	?>

Step 5.

Now add login.php page in index.php page at the top like below. Just copy the below code and paste it in your index.php page at the top.

In next line code we are checking the session. If session has been started then open the session logout page.

	
	<?php
	
		include('login.php'); // Includes Login Script
		
		if(isset($_SESSION['user_name'])){
		header("location: logout.php");
		}
	?>
	

Step 6.

After login a new page will be open (logout.php). In that page we will destroy the session by adding the below code in the page. Now we will create logout page to destroy the session.

Now create a logout.php page to destroy the session.

	<?php

	session_start();
	session_destroy();

	// this for clear the session variable (like user name variable)
	$_SESSION = array();

	//after logout move out to index.php page.
	header("Location:../index.php");

?>

Step 7. Final Step

Our login page tutorial has been completed. Now test your page on browser.

Advertisment

Post Your Comment