Authenciation file structure
There are several files needed to completed a webpage authencaition. We create login, register and logout pages. Some files of this sample projects are listed below
your-root-directory/ css/ style.css admin/ dbconfig.php index.php login.php register.php data.php And finaly include a sql file.All files looks like this picture
create a admin database configure file
Now we will create a file where server information are located
admin/dbconfig.php
<?php
$server_name="127.0.0.1"; // server name
$server_username="root"; // server username
$server_password=""; // server password
$server_database="taslim1"; // database name
$connect=mysql_connect($server_name,$server_username,$server_password) or die ("Server error : Server information is wrong.");
$data=mysql_select_db($server_database) or die ("Database error : Database not found in your server.");
?>
Create a front page
Create front page of this samples where all information and links are located here to easily navigate.
index.php
index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<title>A simple project of login and register</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<h1>A Simple Project of Login And Register</h1>
</div>
<div id="navbar">
<a href="index.php">Home</a>
<a href="register.php">Register</a>
<a href="data.php">Data</a>
<?php
if (isset($_COOKIE["cookiename"])){
echo "User : " . $_COOKIE["cookiename"] . "";
echo " <a href='logout.php'>logout</a>";}
else{
echo "<a href='login.php'>Login</a>";
echo " User : Guest!\n";}
?>
</div>
<div id="content">
This is a sample project of Site authenciation.
</div>
<div id="footer">
Copyright @ taslim. Anybody can use it for personal and commercial.
</div>
</body>
</html>
Create Register Page
Cretae a file where the register a user. Here necessary inforamtion box are added. Because to register a user many information are required. If anybody want to know more inforamtion they can add input box.
register.php
register.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<title>A simple project of login and register</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<h1>A Simple Project of Login And Register</h1>
</div>
<div id="navbar">
<a href="index.php">Home</a>
<a href="register.php">Register</a>
<a href="data.php">Data</a>
<?php
if (isset($_COOKIE["cookiename"])){
echo "User : " . $_COOKIE["cookiename"] . "";
echo " <a href='logout.php'>logout</a>";}
else{
echo "<a href='login.php'>Login</a>";
echo " User : Guest!\n";}
?>
</div>
<div id="content">
<form action="" method="post">
<table class="register" cellpadding="0" cellspacing="0">
<caption>Register</caption>
<tr>
<td>Email*</td>
<td>
<?php $a=1; ?>
<input type="text" name="email" value="<?php if(isset($_POST['email'])) echo $_POST['email']; ?>"/>
<?php
if(isset($_POST['register'])){
$email_pattern = "/^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/";
$email = $_POST['email'];
if (preg_match($email_pattern,$email)) {}
else{
echo "<br/><span class='error'>Email must be valid.</span>";
$a=0;
}
}
?>
</td>
</tr>
<tr>
<td>Username*</td>
<td><input type="text" name="username" maxlength="12" value="<?php if(isset($_POST['username'])) echo $_POST['username']; ?>"/>
<?php
if(isset($_POST['register'])){
$username_pattern = "/^[a-zA-Z]{4,12}$/";
$username = $_POST['username'];
if (preg_match($username_pattern,$username)) {}
else{
echo "<br/><span class='error'>Username only contains letters. others are prohibited.</span>";
$a=0;
}
}
?>
</td>
</tr>
<tr>
<td>Password*</td>
<td><input type="password" name="password" maxlength="12" value=""/>
<?php
if(isset($_POST['register'])){
$password_pattern = "/^[a-zA-Z0-9._-]{4,12}$/";
$password = $_POST['password'];
if (preg_match($password_pattern,$password)) {}
else{
echo "<br/><span class='error'>Password must be contain combination of 4 to 12 letters,digits,dot and hiphen.</span>";
$a=0;
}
}
?>
</td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password1" maxlength="12" value=""/>
<?php
if((isset($_POST['password1']))!=(isset($_POST['password1']))){
echo "<br/><span class='error'>Password did not match.</span>";
$a=0;
}
?>
</td>
</tr>
<tr>
<td>Privience/city</td>
<td><input type="text" name="state" maxlength="12" value="<?php if(isset($_POST['state'])) echo $_POST['state']; ?>"/></td>
</tr>
<tr>
<td>Country</td>
<td>
<select name="country">
<option selected="selected" value="<?php if(isset($_POST['country'])) echo $_POST['country']; ?>">
<?php if(isset($_POST['country'])) echo $_POST['country']; else echo "Choose"; ?>
</option>
<option value="bangladesh">Bangladesh</option>
<option value="pakistan">Pakistan</option>
<option value="uk">UK</option>
<option value="espan">Espan</option>
<option value="france">France</option>
<option value="usa">USA</option>
<option value="oters">Others</option>
</select>
</td>
</tr>
<tr>
<td><input type="checkbox" name="agree"/>*</td>
<td>Are you agree with our terms and policies.
<?php
if(isset($_POST['register'])){
if((isset($_POST['agree']))!="selected"){
echo "<br/><span class='error'>You must agree with our terms and policies.</span>";
$a=0;
}
}
?>
</td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="register" value="Register"/></td>
</tr>
</table>
</form>
</div>
<?php
if(isset($_POST['register'])){
$user=$_POST['username'];
$pass=$_POST['password'];
$email=$_POST['email'];
$state=$_POST['country'];
$country=$_POST['state'];
if($a!=0){
$ins=mysql_query("insert into userinfo(state,country,email,username,password) values('$state','$country','$email','$user','$pass')");
if($ins){
echo "Your data inserted.";
}
else{
echo "Error occured. try again.";
}
}
else{
echo "You must need to insert correct information.";
}
}
?>
<div id="footer">
Copyright @ taslim. Anybody can use it for personal and commercial.
</div>
</body>
</html>
Create a login or signup page Page
Cretae a file where a user input their information to access the websites. There only required two input forms . One for username and other for password. Here check the username and password which are already available in the specific database to enter the websites.
login.php
login.php
<?php include("dbconfig.php"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<title>A simple project of login and register</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<h1>A Simple Project of Login And Register</h1>
</div>
<div id="navbar">
<a href="index.php">Home</a>
<a href="register.php">Register</a>
<a href="data.php">Data</a>
<?php
if (isset($_COOKIE["cookiename"])){
echo "User : " . $_COOKIE["cookiename"] . "";
echo " <a href='logout.php'>logout</a>";}
else{
echo "<a href='login.php'>Login</a>";
echo " User : Guest!\n";}
?>
</div>
<div id="content">
<form action="" method="post">
<table class="login" cellpadding="0" cellspacing="0">
<caption>Login</caption>
<tr>
<td>Username</td>
<td><input type="text" name="username" maxlength="12" value=""/></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password" maxlength="12" value=""/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="login" value="Login"/></td>
</tr>
<tr>
<td colspan="2">If you are a new user, <a href="">click here </a></td>
</tr>
</table>
</form>
</div>
<?php
if(isset($_POST['login'])){
$user=$_POST['username'];
$pass=$_POST['password'];
$select=mysql_query("select * from userinfo where username='$user' AND password='$pass'");
$found=mysql_num_rows($select);
if($found>0){
$expire=time()+60*60*24*30;
setcookie("cookiename", $user, $expire);
header("location:index.php");
}
else{
echo "Username or password error.";
}
}
?>
<div id="footer">
Copyright @ taslim. Anybody can use it for personal and commercial.
</div>
</body>
</html>
Show Data from databases using php
When a user infomation is inserted then this page grab all the information from the database
data.php
data.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<title>A simple project of login and register</title>
<link rel="stylesheet" type="text/css" href="style.css">
<style type="text/css">
</style>
</head>
<body>
<div id="header">
<h1>A Simple Project of Login And Register</h1>
</div>
<div id="navbar">
<a href="index.php">Home</a>
<a href="register.php">Register</a>
<a href="data.php">Data</a>
<?php
if (isset($_COOKIE["cookiename"])){
echo "User : " . $_COOKIE["cookiename"] . "";
echo " <a href='logout.php'>logout</a>";}
else{
echo "<a href='login.php'>Login</a>";
echo " User : Guest!\n";}
?>
</div>
<div id="content">
<table class="data" cellpadding="0" cellspacing="0">
<caption>User Data</caption>
<tr>
<td width="5%">Id</td>
<td width="35%">Email</td>
<td width="15%">User</td>
<td width="15%">Password</td>
<td width="15%">State</td>
<td width="15%">Country</td>
</tr>
<?php
$select=mysql_query("select * from userinfo");
while($row=mysql_fetch_array($select)){
echo "<tr>
<td>".$row['id']."</td>
<td>".$row['email']."</td>
<td>".$row['username']."</td>
<td>".$row['password']."</td>
<td>".$row['state']."</td>
<td>".$row['password']."</td>
</tr>";
}
?>
</table>
</div>
<div id="footer">
Copyright @ taslim. Anybody can use it for personal and commercial.
</div>
</body>
</html>
Create a logout page
Now create a logout apge in php. When a user logged in, then the user need to log out.
logout.php
logout.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US">
<head>
<title>A simple project of login and register</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<style type="text/css">
</style>
</head>
<body>
<div id="header">
<h1>A Simple Project of Login And Register</h1>
</div>
<div id="navbar">
<a href="index.php">Home</a>
<a href="register.php">Register</a>
<a href="data.php">Data</a>
<?php
if (isset($_COOKIE["cookiename"])){
echo "User : " . $_COOKIE["cookiename"] . "";
echo " <a href='logout.php'>logout</a>";}
else{
echo "<a href='login.php'>Login</a>";
echo " User : Guest!<br />";}
?>
</div>
<div id="content">
<?php
if(setcookie("cookiename","", time()-3600))
echo "You are logged out.";
else echo "No body are logeed";
?>
</div>
<div id="footer">
Copyright @ taslim. Anybody can use it for personal and commercial.
</div>
</body>
</html>
Design this authenciation projects
For tableless desgin we need to design with css
css/style.css
css/style.css
body{
width:600px;
margin:0 auto;
}
#header{
width:96%
padding:2%;
}
#navbar{
background:#f1f1f1;
padding:2%;
width:96%;
color:darkgray;
margin-top:60px;
}
#navbar a{
padding:5px 10px;
text-decoration:none;
color:green;
}
#content{
padding:2%;
width:96%;
margin:10px 0px;
background:#f1f1f1;
color:dimgray;
}
.box {
width:15%;
margin:.5%;
padding:4.5%;
float:left;
background:#f1f1f1;
text-decoration:none;
font-size:20px;
}
.box:hover{
background:red;
}
.clear{
clear:both;
}
#footer{
background:#f6f6f6;
padding:2%;
width:96%;
color:darkgray;
margin-top:60px;
}
caption{
background:red;
color:white;
padding:5px;
}
.data td{
padding:5px;
}
.data tr:nth-child(2n+1){
background:#f6f6f6;
}
.register{
width:75%;
margin:0 auto;
}
.register td{
padding:5px;
font-size:15px;
color:dimgray;
}
input[type="text"],input[type="password"]{
padding:10px;
border:1px solid darkgray;
width:200px;
}
input[type="submit"]{
padding:10px 30px;
border:1px solid darkgray;
background:#f1f1f1;
}
.error{
color:red;
}
select{
text-transform:capitalize;
}
.login{
width:60%;
margin:0 auto;
}
.login td{
padding:5px;
font-size:15px;
color:dimgray;
}
.data{
width:100%;
}
The database file
Here show a database qury which is used in this project.
sql file
sql file
-- -- Database: `taslim1` -- -- -------------------------------------------------------- -- -- Table structure for table `userinfo` -- CREATE TABLE IF NOT EXISTS `userinfo` ( `id` int(100) NOT NULL AUTO_INCREMENT, `state` varchar(20) NOT NULL, `country` varchar(10) NOT NULL, `email` varchar(20) NOT NULL, `username` varchar(12) NOT NULL, `password` varchar(12) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
I want to add a login like this to my blogger.. where and how do I start? email direction please to jamarkg@yahoo.com
ReplyDeletecool..thanks for the post it really helped me out
ReplyDeletethanks this is great
ReplyDeleteHow to use this code please tell me
ReplyDelete