Login page is very important in any social or eCommerce website. So today I am going to show you how login page works.

In this tutorial I am going to show you the very simple form of login page. First design the html form for login username and password.

HTML login code:

<!DOCTYPE html>
<html>
<title>Login page tutorial</title>
<body>
<div style="margin-left:250px;">
<h1>User Login</h1>

 <form method="post" action="action.php">
<label style="margin-right:10px;">User Name:</label>
<input style="margin-left:20px; width:250px;" type="text" name="username">
<div style="clear:both;">
<label style="margin-right:20px;">Password:</label>
<input style="margin-left:20px; width:250px;" type="password" name="userpassword">
<div style="clear:both">
<input style="margin-top:20px; margin-left:107px;" type="submit"></input>
</form>
</div>
</body>
</html>

Generated Output:


the design section for login page is completed, now it time to write php code for login. For that first of all make a database with name as login under login make a table give name it to users. Put a username and password in users table.

Action.php page code:

<?php
 //db connection start
$dbCon = mysql_connect("localhost","root","") or die ('MySQL connect failed. ' . mysql_error());

 mysql_select_db("login") or die('Cannot select database. ' . mysql_error());

  //db connection end

 $username   = $_POST['username'];

 $password = $_POST['userpassword'];

 $query = mysql_query("select * from users where username='".$username."' and password= '".$password."'"); // query to fetch data from db

 $result = mysql_num_rows($query);

 if($result==1){  //login condition
?> <h1 style="margin-left:200px; margin-top:200px;"><?php echo "Login Success!";?></h1><?php 
}else{
?> <h1 style="margin-left:200px; margin-top:200px;"><?php echo "Login Failed!";?></h1><?php 
}

 ?>


Description of the Code:

I put username =admin & password=admin in the users table so if the username and password is equal to admin then the output will be.


if the username and password is wrong then the output will be.


Note: validations are not include in this tutorial, different articles about validations will be published soon.
If you like this article then show your interest by commenting or like our facebook page.