E-commerce

E-commerce site from the scratch-part3

Fahmida Yesmin January 27, 2024 no Comments

How to create new user account, login to the account and modify the information of the user have been shown in this tutorial. You have to complete the part1 and part2 of this project before starting this tutorial.

Step-1:

Open the project folder and create the file login.php and add the following content.

<?php
session_start();
error_reporting(0);
$message="";
$title="User Account";
include('includes/config.php');

/**********user Registration***********/

if(isset($_POST['submit']))
{
$name=$_POST['fullname'];
$email=$_POST['emailid'];
$contactno=$_POST['contactno'];
$password=md5($_POST['password']);
$query=mysqli_query($con,"insert into users(name,email,contactno,password) values('$name','$email','$contactno','$password')");
if($query)
{
$message="Registration completed successfully.";
}
else{
$message="Registration is unsuccessful.";
}
}

/********User login**********/

if(isset($_POST['login']))
{
$email=$_POST['email'];
$password=md5($_POST['password']);
$query=mysqli_query($con,"SELECT * FROM users WHERE email='$email' and password='$password'");
$num=mysqli_fetch_array($query);
if($num>0)
{
$extra="my-cart.php";
$_SESSION['login']=$_POST['email'];
$_SESSION['id']=$num['id'];
$_SESSION['username']=$num['name'];
$uip=$_SERVER['REMOTE_ADDR'];
$status=1;
$log=mysqli_query($con,"insert into userlog(userEmail,userip,status) values('".$_SESSION['login']."','$uip','$status')");
$host=$_SERVER['HTTP_HOST'];
$uri=rtrim(dirname($_SERVER['PHP_SELF']),'/\\');
header("location:http://$host$uri/$extra");
exit();
}
else
{
$extra="login.php";
$email=$_POST['email'];
$uip=$_SERVER['REMOTE_ADDR'];
$status=0;

$log=mysqli_query($con,"insert into userlog(userEmail,userip,status) values('$email','$uip','$status')");
$host  = $_SERVER['HTTP_HOST'];
$uri  = rtrim(dirname($_SERVER['PHP_SELF']),'/\\');
header("location:http://$host$uri/$extra");
$_SESSION['errmsg']="Invalid email id or Password";
exit();
}
}

?>


<?php include('head.php');?>
<?php include('includes/top-header.php');?>
<?php include('includes/main-header.php');?>
<?php include('includes/menu-bar.php');?>
</header>

<div class="breadcrumb">
<div class="container">
<div class="breadcrumb-inner">
<ul class="list-inline list-unstyled">
<li><a href="home.html">Home</a></li>
<li class='active'>User Account</li>
</ul>

</div><!-- /.breadcrumb-inner -->
</div><!-- /.container -->
</div><!-- /.breadcrumb -->
<?php
if($message!="")
{
echo "<center><div class='alert alert-success' role='alert'><h3>$message</h3></div><center>";
$message="";
}
?>

<div class="body-content outer-top-bd">

<div class="container">
<div class="sign-in-page inner-bottom-sm">
<div class="row">

<!-- Sign-in -->
<div class="col-md-6 col-sm-6 sign-in">
<h4 class="">sign in</h4>
<form class="register-form outer-top-xs" method="post">
<span style="color:red;" >
<?php

echo htmlentities($_SESSION['errmsg']);
?>
<?php
echo htmlentities($_SESSION['errmsg']="");
?>

</span>
<div class="form-group">
<label class="info-title" for="exampleInputEmail1">Email Address <span>*</span></label>
<input type="email" name="email" class="form-control unicase-form-control text-input" id="exampleInputEmail1" >
</div>

<div class="form-group">
<label class="info-title" for="exampleInputPassword1">Password <span>*</span></label>
<input type="password" name="password" class="form-control unicase-form-control text-input" id="exampleInputPassword1" >

</div>
<div class="radio outer-xs">
<a href="forgot-password.php" class="forgot-password pull-right">Forgot your Password?</a>
</div>

<button type="submit" class="btn-upper btn btn-primary checkout-page-button" name="login">Login</button>
</form>
</div>

<!-- create a new account -->
<div class="col-md-6 col-sm-6 create-new-account">
<h4 class="checkout-subtitle">create a new account</h4>

<form class="register-form outer-top-xs" role="form" method="post" name="register" onSubmit="return valid();">
<div class="form-group">
<label class="info-title" for="fullname">Full Name <span>*</span></label>
<input type="text" class="form-control unicase-form-control text-input" id="fullname" name="fullname" required="required">
</div>

<div class="form-group">
<label class="info-title" for="exampleInputEmail2">Email Address <span>*</span></label>
<input type="email" class="form-control unicase-form-control text-input" id="email" onBlur="userAvailability()" name="emailid" required >
<span id="user-availability-status1" style="font-size:12px;"></span>
</div>

<div class="form-group">
<label class="info-title" for="contactno">Contact No. <span>*</span></label>
<input type="text" class="form-control unicase-form-control text-input" id="contactno" name="contactno" maxlength="10" required >
</div>

<div class="form-group">
<label class="info-title" for="password">Password. <span>*</span></label>
<input type="password" class="form-control unicase-form-control text-input" id="password" name="password"  required >
</div>

<div class="form-group">
<label class="info-title" for="confirmpassword">Confirm Password. <span>*</span></label>
<input type="password" class="form-control unicase-form-control text-input" id="confirmpassword" name="confirmpassword" required >

</div>
<button type="submit" name="submit" class="btn-upper btn btn-primary checkout-page-button" id="submit">Sign Up</button>
</form>
</div>

<!-- create a new account -->			
</div><!-- /.row -->
</div>
<?php include('includes/brands-slider.php');?>
</div>
</div>
<?php 

include('includes/footer.php');
include ("foot.html");
?>

<script type="text/javascript">

function valid()
{
if(document.register.password.value!= document.register.confirmpassword.value)
{
alert("Password and Confirm Password Field do not match  !!");
document.register.confirmpassword.focus();
return false;
}
return true;
}

function userAvailability() {
$("#loaderIcon").show();
jQuery.ajax({
url: "check_availability.php",
data:'email='+$("#email").val(),
type: "POST",
success:function(data){
$("#user-availability-status1").html(data);
$("#loaderIcon").hide();
},
error:function (){}
});
}

$(document).ready(function(){
$(".changecolor").switchstylesheet( { seperator:"color"} );
$('.show-theme-options').click(function(){
$(this).parent().toggleClass('open');
return false;
});
});

$(window).bind("load", function() {
$('.show-theme-options').delay(2000).trigger('click');
});
</script>

</body>
</html>

Step-2:

Create the file logout.php and add the following content.

<?php
session_start();
include("includes/config.php");
$_SESSION['login']=="";
date_default_timezone_set('Asia/Dhaka');
$ldate=date( 'd-m-Y h:i:s A', time () );
mysqli_query($con,"UPDATE userlog  SET logout = '$ldate' WHERE userEmail = '".$_SESSION['login']."' ORDER BY id DESC LIMIT 1");

session_unset();
$_SESSION['errmsg']="You have successfully logout";
?>
<script language="javascript">
document.location="index.php";
</script>

Step-3:

Create the file my-cart.php and add the following content.

<?php
session_start();
error_reporting(0);
$message="";
include('includes/config.php');
if(isset($_POST['submit'])){
if(!empty($_SESSION['cart'])){
foreach($_POST['quantity'] as $key => $val){
if($val==0){
unset($_SESSION['cart'][$key]);
}else{
$_SESSION['cart'][$key]['quantity']=$val;
}
}
$message='Your Cart has been Updated';
}
}

// Code for Remove a Product from Cart

if(isset($_POST['remove_code']))
{
if(!empty($_SESSION['cart'])){
foreach($_POST['remove_code'] as $key){
unset($_SESSION['cart'][$key]);
}
$message='Your Cart has been Updated';
}
}

if(isset($_POST['ordersubmit']))
{
if(strlen($_SESSION['login'])==0)
{
header('location:login.php');
}
else{
$quantity=$_POST['quantity'];
$pdd=$_SESSION['pid'];
$value=array_combine($pdd,$quantity);
foreach($value as $qty=> $val34){
mysqli_query($con,"insert into orders(userId,productId,quantity) values('".$_SESSION['id']."','$qty','$val34')");
header('location:addresses.php');
}
}
}

$title="My Cart";
include('head.php');
?>

<?php include('includes/top-header.php');?>
<?php include('includes/main-header.php');?>
<?php include('includes/menu-bar.php');?>
</header>

<div class="breadcrumb">
<div class="container">
<div class="breadcrumb-inner">
<ul class="list-inline list-unstyled">
<li><a href="#">Home</a></li>
<li class='active'>Shopping Cart</li>
</ul>

</div><!-- /.breadcrumb-inner -->
</div><!-- /.container -->
</div><!-- /.breadcrumb -->
<?php if($message!="") { echo "<center><div class='alert alert-success' role='alert'><h3>$message</h3></div><center>"; $message=""; }
?>

<div class="body-content outer-top-xs">
<div class="container">
<div class="row inner-bottom-sm">
<div class="shopping-cart">
<div class="col-md-12 col-sm-12 shopping-cart-table ">
<div class="table-responsive">
<form name="cart" method="post">
<?php

if(!empty($_SESSION['cart'])){
?>
<table class="table table-bordered">
<thead>
<tr>
<th class="cart-romove item">Remove</th>
<th class="cart-description item">Image</th>
<th class="cart-product-name item">Product Name</th>
<th class="cart-qty item">Quantity</th>
<th class="cart-sub-total item">Price Per unit</th>
<th class="cart-sub-total item">Shipping Charge</th>
<th class="cart-total last-item">Grandtotal</th>
</tr>

</thead><!-- /thead -->
<tfoot>
<tr>
<td colspan="7">
<div class="shopping-cart-btn">
<span class="">
<a href="index.php" class="btn btn-upper btn-primary outer-left-xs">Continue Shopping</a>
<input type="submit" name="submit" value="Update shopping cart" class="btn btn-upper btn-primary pull-right outer-right-xs">
</span>

</div><!-- /.shopping-cart-btn -->
</td>
</tr>
</tfoot>
<tbody>

<?php
$pdtid=array();
$sql = "SELECT * FROM products WHERE id IN(";
foreach($_SESSION['cart'] as $id => $value){
$sql .=$id. ",";
}
$sql=substr($sql,0,-1) . ") ORDER BY id ASC";
$query = mysqli_query($con,$sql);
$totalprice=0;
$totalqunty=0;

if(!empty($query)){
while($row = mysqli_fetch_array($query)){
$quantity=$_SESSION['cart'][$row['id']]['quantity'];
$subtotal= $_SESSION['cart'][$row['id']]['quantity']*$row['productPrice']+$row['shippingCharge'];
$totalprice += $subtotal;
$_SESSION['qnty']=$totalqunty+=$quantity;
array_push($pdtid,$row['id']);
?>

<tr>
<td class="romove-item"><input type="checkbox" name="remove_code[]" value="<?php echo htmlentities($row['id']);?>" /></td>
<td class="cart-image">
<a class="entry-thumbnail" href="detail.html">
<img src="admin/productimages/<?php echo $row['productImage'];?>" alt="" width="114" height="146">
</a>
</td>
<td class="cart-product-name-info">
<h4 class='cart-product-description'><a href="product-details.php?pid=<?php echo htmlentities($pd=$row['id']);?>" ><?php echo $row['productName'];
$_SESSION['sid']=$pd;
?></a></h4>

<div class="row">
<div class="col-sm-4">
<div class="rating rateit-small"></div>
</div>
<div class="col-sm-8">
<?php $rt=mysqli_query($con,"select * from productreviews where productId='$pd'");
$num=mysqli_num_rows($rt);
{
?>

<div class="reviews">
( <?php echo htmlentities($num);?> Reviews )
</div>
<?php } ?>

</div>
</div><!-- /.row -->
</td>
<td class="cart-product-quantity">
<div class="quant-input">
<div class="arrows">
<div class="arrow plus gradient"><span class="ir"><i class="icon fa fa-sort-asc"></i></span></div>
<div class="arrow minus gradient"><span class="ir"><i class="icon fa fa-sort-desc"></i></span></div>
</div>
<input type="text" value="<?php echo $_SESSION['cart'][$row['id']]['quantity']; ?>" name="quantity[<?php echo $row['id']; ?>]">
</div>
</td>
<td class="cart-product-sub-total"><span class="cart-sub-total-price"><?php echo "Tk"." ".$row['productPrice']; ?>.00</span></td>
<td class="cart-product-sub-total"><span class="cart-sub-total-price"><?php echo "Tk"." ".$row['shippingCharge']; ?>.00</span></td>
<td class="cart-product-grand-total"><span class="cart-grand-total-price"><?php echo ($_SESSION['cart'][$row['id']]['quantity']*$row['productPrice']+$row['shippingCharge']); ?>.00</span></td>
</tr>
<?php } }

$_SESSION['pid']=$pdtid;
?>
</tbody><!-- /tbody -->
</table><!-- /table -->
</div>
</div><!-- /.shopping-cart-table -->			
<div class="col-md-4 col-sm-12 estimate-ship-tax">
<table class="table table-bordered">
<thead>
<tr>
<th>
<span class="estimate-title">Shipping Address</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>

<div class="form-group">
<?php $qry=mysqli_query($con,"select * from users where id='".$_SESSION['id']."'");
while ($rt=mysqli_fetch_array($qry)) {
echo htmlentities($rt['shippingAddress'])."<br />";
echo htmlentities($rt['shippingCity'])."<br />";
echo htmlentities($rt['shippingState']);
echo htmlentities($rt['shippingPincode']);
}
?>
</div>
</td>
</tr>
</tbody><!-- /tbody -->
</table><!-- /table -->
</div>
<div class="col-md-4 col-sm-12 estimate-ship-tax">
<table class="table table-bordered">
<thead>
<tr>
<th>
<span class="estimate-title">Billing Address</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-group">
<?php $qry=mysqli_query($con,"select * from users where id='".$_SESSION['id']."'");
while ($rt=mysqli_fetch_array($qry)) {
echo htmlentities($rt['billingAddress'])."<br />";
echo htmlentities($rt['billingCity'])."<br />";
echo htmlentities($rt['billingState']);
echo htmlentities($rt['billingPincode']);
}
?>
</div>
</td>
</tr>
</tbody><!-- /tbody -->
</table><!-- /table -->
</div>
<div class="col-md-4 col-sm-12 cart-shopping-total">
<table class="table table-bordered">
<thead>
<tr>
<th>

<div class="cart-grand-total">
Grand Total<span class="inner-left-md"><?php echo $_SESSION['tp']="$totalprice". ".00"; ?></span>
</div>
</th>
</tr>
</thead><!-- /thead -->
<tbody>
<tr>
<td>
<div class="cart-checkout-btn pull-right">
<button type="submit" name="ordersubmit" class="btn btn-primary">PROCCED TO CHEKOUT</button>
</div>
</td>
</tr>
</tbody><!-- /tbody -->
</table>
<?php } else {
echo "Your shopping Cart is empty";
}?>
</div>			
</div>
</div>
</form>

<?php echo include('includes/brands-slider.php');?>
</div>
</div>
<?php 
include('includes/footer.php');
include ("foot.html");
?>
<script>

$(document).ready(function(){
$(".changecolor").switchstylesheet( { seperator:"color"} );
$('.show-theme-options').click(function(){
$(this).parent().toggleClass('open');
return false;
});
});
$(window).bind("load", function() {
$('.show-theme-options').delay(2000).trigger('click');
});
</script>

</body>
</html>

Step-4:

Create the file my-account.php and add the following content.

<?php
session_start();
error_reporting(0);
$message="";
include('includes/config.php');
if(strlen($_SESSION['login'])==0)
{
header('location:index.php');
}
else{
if(isset($_POST['update']))
{
$name=$_POST['name'];
$contactno=$_POST['contactno'];
$query=mysqli_query($con,"update users set name='$name',contactno='$contactno' where id='".$_SESSION['id']."'");
if($query)
{
$message = 'Your info has been updated.';
}
}


date_default_timezone_set('Asia/Dhaka');
$currentTime = date( 'd-m-Y h:i:s A', time () );
if(isset($_POST['submit']))
{
$sql=mysqli_query($con,"SELECT password FROM  users where password='".md5($_POST['cpass'])."' && id='".$_SESSION['id']."'");
$num=mysqli_fetch_array($sql);
if($num>0)
{
mysqli_query($con,"update users set password='".md5($_POST['newpass'])."', updationDate='$currentTime' where id='".$_SESSION['id']."'");
$message = 'Password Changed Successfully.';
}
else
{
$message='Current Password not match.';
}
}

$title="My Account";
include('head.php');
?>


<?php include('includes/top-header.php');?>
<?php include('includes/main-header.php');?>
<?php include('includes/menu-bar.php');?>
</header>

<div class="breadcrumb">
<div class="container">
<div class="breadcrumb-inner">
<ul class="list-inline list-unstyled">
<li><a href="#">Home</a></li>
<li class='active'>Checkout</li>
</ul>
</div><!-- /.breadcrumb-inner -->
</div><!-- /.container -->
</div><!-- /.breadcrumb -->

<?php
if($message!="")
{
echo "<center><div class='alert alert-success' role='alert'><h3>$message</h3></div><center>";
$message="";
}
?>

<div class="body-content outer-top-bd">
<div class="container">
<div class="checkout-box inner-bottom-sm">
<div class="row">
<div class="col-md-8">
<div class="panel-group checkout-steps" id="accordion">

<div class="panel panel-default checkout-step-01">
<div class="panel-heading">
<h4 class="unicase-checkout-title">
<a data-toggle="collapse" class="" data-parent="#accordion" href="#collapseOne">
<span>1</span>My Profile
</a>
</h4>
</div>

<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
<div class="row">
<h4>Personal info</h4>
<div class="col-md-12 col-sm-12 already-registered-login">

<?php
$query=mysqli_query($con,"select * from users where id='".$_SESSION['id']."'");
while($row=mysqli_fetch_array($query))
{
?>
<form class="register-form" role="form" method="post">
<div class="form-group">
<label class="info-title" for="name">Name<span>*</span></label>
<input type="text" class="form-control unicase-form-control text-input" value="<?php echo $row['name'];?>" id="name" name="name" required="required">
</div>

<div class="form-group">
<label class="info-title" for="exampleInputEmail1">Email Address <span>*</span></label>
<input type="email" class="form-control unicase-form-control text-input" id="exampleInputEmail1" value="<?php echo $row['email'];?>" readonly>
</div>

<div class="form-group">
<label class="info-title" for="Contact No.">Contact No. <span>*</span></label>
<input type="text" class="form-control unicase-form-control text-input" id="contactno" name="contactno" required="required" value="<?php echo $row['contactno'];?>"  maxlength="10">
</div>

<button type="submit" name="update" class="btn-upper btn btn-primary checkout-page-button">Update</button>
</form>
<?php } ?>
</div>

</div>
</div>

</div><!-- row -->
</div>

<div class="panel panel-default checkout-step-02">
<div class="panel-heading">
<h4 class="unicase-checkout-title">
<a data-toggle="collapse" class="collapsed" data-parent="#accordion" href="#collapseTwo">
<span>2</span>Change Password
</a>
</h4>
</div>

<div id="collapseTwo" class="panel-collapse collapse">
<div class="panel-body">
<form class="register-form" role="form" method="post" name="chngpwd" onSubmit="return valid();">
<div class="form-group">
<label class="info-title" for="Current Password">Current Password<span>*</span></label>
<input type="password" class="form-control unicase-form-control text-input" id="cpass" name="cpass" required="required">
</div>

<div class="form-group">
<label class="info-title" for="New Password">New Password <span>*</span></label>
<input type="password" class="form-control unicase-form-control text-input" id="newpass" name="newpass">
</div>

<div class="form-group">
<label class="info-title" for="Confirm Password">Confirm Password <span>*</span></label>
<input type="password" class="form-control unicase-form-control text-input" id="cnfpass" name="cnfpass" required="required" >
</div>
<button type="submit" name="submit" class="btn-upper btn btn-primary checkout-page-button">Change </button>
</form>
</div>
</div>
</div>
</div>
</div>

<?php include('myaccount-sidebar.php');?>
</div><!-- /.row -->
</div><!-- /.checkout-box -->
<?php include('includes/brands-slider.php');?>
</div>
</div>
<?php 
include('includes/footer.php');
include ("foot.html");
?>

<script type="text/javascript">

function valid()
{
if(document.chngpwd.cpass.value=="")
{
alert("Current Password Filed is Empty !!");
document.chngpwd.cpass.focus();
return false;
}
else if(document.chngpwd.newpass.value=="")
{
alert("New Password Filed is Empty !!");
document.chngpwd.newpass.focus();
return false;
}
else if(document.chngpwd.cnfpass.value=="")
{
alert("Confirm Password Filed is Empty !!");
document.chngpwd.cnfpass.focus();
return false;
}
else if(document.chngpwd.newpass.value!= document.chngpwd.cnfpass.value)
{
alert("Password and Confirm Password Field do not match  !!");
document.chngpwd.cnfpass.focus();
return false;
}
return true;
}


$(document).ready(function(){
$(".changecolor").switchstylesheet( { seperator:"color"} );
$('.show-theme-options').click(function(){
$(this).parent().toggleClass('open');
return false;
});
});
$(window).bind("load", function() {
$('.show-theme-options').delay(2000).trigger('click');
});
</script>
</body>
</html>
<?php } ?>

Step-5:

Now, create a new user account, login to the account and open the user’s account page.

Next Tutorial–>

FahmidasClassroom

E-commerce site from the scratch-part3

Related

You Are Here

E-commerce site from the scratch-part3

Share this:

Related