Viewing File: /home/webrbaew/kitothecandytea.com/product-details.php
<!DOCTYPE html><html lang="en">
<head>
<?php
include "includes/operations.php";
include "includes/headerlinks.php";
include "functions.php";
$product_id = 0;
if(isset($_GET['id'])){
$product_id = intval($_GET['id']);
}
$result = mysqli_query($con, "SELECT * FROM product WHERE product_id=$product_id");
$total_items = mysqli_num_rows($result);
$prod_row = mysqli_fetch_array($result);
?>
<style>
.cus-hr {
border-top-width:0px !important;border-bottom:1px solid #e4e4e4 !important;
}
.fa-star {
color:#ffc107 !important;
}
.reviews__comment--content {
width:100% !important;
}
.desk-div {
display:none;
}
@media (max-width:700px){
.cus-mob {
display:none;
}
.desk-div {
display:block;
}
}
</style>
</head>
<body>
<?php include "includes/top_header.php";?>
<?php include "includes/navigation.php";?>
<?php include "includes/mobile_navigation.php";?>
<?php include "includes/mobile_sticky_menus.php";?>
<?php include "includes/cart_window.php";?>
<?php include "includes/search.php";?>
<main class="main__content_wrapper">
<!-- Start slider section -->
<section class="breadcrumb__section breadcrumb__bg">
<div class="container">
<div class="row row-cols-1">
<div class="col">
<div class="breadcrumb__content">
<h1 class="breadcrumb__content--title text-white mb-10">Product Details</h1>
<ul class="breadcrumb__content--menu d-flex">
<li class="breadcrumb__content--menu__items"><a class="text-white" href="index.php">Home</a></li>
<li class="breadcrumb__content--menu__items"><span class="text-white">Product Details</span></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="product__details--section section--padding">
<div class="container">
<div class="row row-cols-lg-2 row-cols-md-2">
<center>
<div class="col">
<div class="product__details--media">
<div class="product__media--preview swiper swiper-initialized swiper-horizontal swiper-pointer-events">
<div class="swiper-wrapper" id="swiper-wrapper-d5026e65a69aec106" aria-live="polite" style="transform: translate3d(-580px, 0px, 0px); transition-duration: 0ms;">
<div class="swiper-slide swiper-slide-active" data-swiper-slide-index="0" role="group" aria-label="1 / 6" style="width: 570px; margin-right: 10px;">
<div class="product__media--preview__items">
<a class="product__media--preview__items--link glightbox main-image-popup" data-gallery="product-media-preview" href="images/product_images/<?php echo $prod_row['product_image'];?>"><img class="product__media--preview__items--img" src="images/product_images/<?php echo $prod_row['product_image'];?>" alt="product-media-img"></a>
<div class="product__media--view__icon">
<a class="product__media--view__icon--link glightbox" href="images/product_images/<?php echo $prod_row['product_image'];?>" data-gallery="product-media-preview">
<svg class="product__media--view__icon--svg" xmlns="http://www.w3.org/2000/svg" width="22.51" height="22.443" viewBox="0 0 512 512"><path d="M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z" fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32"></path><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="32" d="M338.29 338.29L448 448"></path></svg>
<span class="visually-hidden">Media Gallery</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</center>
<div class="col">
<div class="product__details--info">
<form action="#">
<h2 class="product__details--info__title mb-15"><?php echo $prod_row['product_title'];?></h2>
<div class="product__details--info__price mb-10">
<span class="current__price">$<?php echo number_format($prod_row['product_price'],2);?></span>
</div>
<p class="product__details--info__desc mb-20"><?php echo $prod_row['product_description'];?></p>
<div class="product__variant mb-15">
<div class="product__variant--list quantity d-flex align-items-center mb-20">
<div class="quantity__box">
<button type="button" class="quantity__value quickview__value--quantity decrease" aria-label="quantity value" value="Decrease Value">-</button>
<label>
<input type="number" class="quantity__number quickview__value--number" value="1">
</label>
<button type="button" class="quantity__value quickview__value--quantity increase" aria-label="quantity value" value="Increase Value">+</button>
</div>
<a class="primary__btn quickview__cart--btn" id="btn_<?php echo $prod_row['product_id'];?>" onclick="add_cart(<?php echo $prod_row['product_id']; ?>,1,<?php echo $prod_row['product_id'];?>)" href="javascript:void(0)" style="margin-left:0px !important">
<svg class="product__list--action__cart--btn__icon" xmlns="http://www.w3.org/2000/svg" width="16.897" height="17.565" viewBox="0 0 18.897 21.565">
<path
d="M16.84,8.082V6.091a4.725,4.725,0,1,0-9.449,0v4.725a.675.675,0,0,0,1.35,0V9.432h5.4V8.082h-5.4V6.091a3.375,3.375,0,0,1,6.75,0v4.691a.675.675,0,1,0,1.35,0V9.433h3.374V21.581H4.017V9.432H6.041V8.082H2.667V21.641a1.289,1.289,0,0,0,1.289,1.29h16.32a1.289,1.289,0,0,0,1.289-1.29V8.082Z"
transform="translate(-2.667 -1.366)"
fill="currentColor"
></path>
</svg>
<span class="product__list--action__cart--text cart_btn" > Add To Cart</span>
</a>
</div>
</div>
<div class="guarantee__safe--checkout">
<h5 class="guarantee__safe--checkout__title">Guaranteed Safe Checkout</h5>
<img class="guarantee__safe--checkout__img" src="images/safe-checkout.webp" alt="Payment Image">
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<section class="product__details--tab__section section--padding">
<div class="container">
<div class="product__details--tab__inner border-radius-10">
<div class="tab_content">
<div id="reviews" class="tab_pane active show">
<div class="product__reviews">
<div class="product__reviews--header">
<h3 class="product__reviews--header__title mb-20">
Customer Reviews (<?php echo mysqli_num_rows(mysqli_query($con, "SELECT * FROM review WHERE product_id=$product_id"))?>)
</h3>
<div class="reviews__ratting d-flex align-items-center cus-mob">
<?php
$review_res = mysqli_query($con, "SELECT * FROM review WHERE product_id=$product_id LIMIT 5");
if (mysqli_num_rows($review_res)>0) {
$overall_rev_res = mysqli_query($con, "SELECT AVG(review_stars) AS overall_stars FROM review WHERE product_id=$product_id");
$overall_rev_row = mysqli_fetch_array($overall_rev_res);
$overall_stars = $overall_rev_row['overall_stars'];
?>
<h3 style="font-size:30px !important">
<b><?php echo number_format($overall_stars, 1, '.', '') ?> <span style="font-size:12px">out of</span> 5.0</b>
</h3>
<h3><b><?php echo show_stars($overall_stars) ?></b></h3><hr class="cus-hr">
<?php
} else {
?>
<?php
}
?>
</div>
<a class="actions__newreviews--btn primary__btn" href="#writereview">Write A Review</a>
</div>
<div class="reviews__comment--area" style="padding:0px !important">
<div class="reviews__comment--list d-flex">
<div class="reviews__comment--content" style="padding-left:0px !important;">
<?php
$review_res = mysqli_query($con, "SELECT * FROM review WHERE product_id=$product_id LIMIT 5");
if (mysqli_num_rows($review_res)>0) {
$overall_rev_res = mysqli_query($con, "SELECT AVG(review_stars) AS overall_stars FROM review WHERE product_id=$product_id");
$overall_rev_row = mysqli_fetch_array($overall_rev_res);
$overall_stars = $overall_rev_row['overall_stars'];
?>
<div class="desk-div">
<h3 style="font-size:30px !important">
<b><?php echo number_format($overall_stars, 1, '.', '') ?> <span style="font-size:12px">out of</span> 5.0</b>
</h3>
<h3><b><?php echo show_stars($overall_stars) ?></b></h3><hr class="cus-hr">
</div>
<?php
} else {
?>
<h4 class="reviews__comment--content__title">
This product has no reviews.
</h4>
<?php
}
?>
<?php $reviews_limit = 20; ?>
<input type="hidden" id="reviews_offset" value="0">
<div id="show_reviews_loading">
</div>
<div id="show_reviews_here">
</div>
</div>
</div>
</div>
<div id="writereview" class="reviews__comment--reply__area">
<form method="POST">
<h3 class="reviews__comment--reply__title mb-15">Add a review </h3>
<div class="reviews__ratting d-flex align-items-center mb-20">
<input type="hidden" name="product_id" value="<?=$product_id?>">
<input type="hidden" id="review_stars" name="review_stars" value="5">
<div class="client-reating">
<span class="raiting-list">
<i class="fa fa-star" id="fa-star-1" style="font-size:24px !important;color:;cursor:pointer" onclick="change_stars(1)"></i>
<i class="fa fa-star-o" id="fa-star-2" style="font-size:24px !important;color:;cursor:pointer" onclick="change_stars(2)"></i>
<i class="fa fa-star-o" id="fa-star-3" style="font-size:24px !important;color:;cursor:pointer" onclick="change_stars(3)"></i>
<i class="fa fa-star-o" id="fa-star-4" style="font-size:24px !important;color:;cursor:pointer" onclick="change_stars(4)"></i>
<i class="fa fa-star-o" id="fa-star-5" style="font-size:24px !important;color:;cursor:pointer" onclick="change_stars(5)"></i>
</span>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-md-6 mb-15">
<label>
<input class="reviews__comment--reply__input" placeholder="Your Name...." name="review_name" type="text" required>
</label>
</div>
<div class="col-lg-6 col-md-6 mb-15">
<label>
<input class="reviews__comment--reply__input" placeholder="Your Email...." name="review_title" type="email" required>
</label>
</div>
<div class="col-12 mb-10">
<textarea class="reviews__comment--reply__textarea" name="review_text" placeholder="Your Comments...." required></textarea>
</div>
</div>
<button class="text-white primary__btn" data-hover="Submit" name="submit_review" type="submit">SUBMIT</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<!-- Start footer section -->
<?php include "includes/footer.php";?>
<!-- End footer section -->
<!-- Quickview Wrapper -->
<div class="modal" id="modal1" data-animation="slideInUp">
<div class="modal-dialog quickview__main--wrapper">
<header class="modal-header quickview__header">
<button class="close-modal quickview__close--btn" aria-label="close modal" data-close="">✕ </button>
</header>
<div class="quickview__inner">
<div class="row row-cols-lg-2 row-cols-md-2">
<div class="col">
<div class="product__details--media">
<div class="product__media--preview swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="product__media--preview__items">
<a class="product__media--preview__items--link glightbox" data-gallery="product-media-preview" href="images/product_images/<?php echo $prod_row['product_image'];?>"><img class="product__media--preview__items--img" src="images/product_images/<?php echo $prod_row['product_image'];?>" alt="product-media-img"></a>
<div class="product__media--view__icon">
<a class="product__media--view__icon--link glightbox" href="images/product_images/<?php echo $prod_row['product_image'];?>" data-gallery="product-media-preview">
<svg class="product__media--view__icon--svg" xmlns="http://www.w3.org/2000/svg" width="22.51" height="22.443" viewBox="0 0 512 512"><path d="M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z" fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32"></path><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="32" d="M338.29 338.29L448 448"></path></svg>
<span class="visually-hidden">Media Gallery</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="product__media--nav swiper">
<div class="swiper__nav--btn swiper-button-next"></div>
<div class="swiper__nav--btn swiper-button-prev"></div>
</div>
</div>
</div>
<div class="col">
<div class="quickview__info">
<form action="#">
<h2 class="product__details--info__title mb-15">Oversize Cotton Dress</h2>
<div class="product__details--info__price mb-12">
<span class="current__price">$58.00</span>
</div>
<p class="product__details--info__desc mb-15">Lorem ipsum dolor sit amet, consectetur adipisicing elit is. Deserunt totam dolores ea numquam labore! Illum magnam totam tenetur fuga quo dolor.</p>
<div class="product__variant">
<div class="quickview__variant--list quantity d-flex align-items-center mb-15">
<div class="quantity__box">
<button type="button" class="quantity__value quickview__value--quantity decrease" aria-label="quantity value" value="Decrease Value">-</button>
<label>
<input type="number" class="quantity__number quickview__value--number" value="1">
</label>
<button type="button" class="quantity__value quickview__value--quantity increase" aria-label="quantity value" value="Increase Value">+</button>
</div>
<button class="primary__btn quickview__cart--btn" type="submit">Add To Cart</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Quickview Wrapper End -->
<?php include "includes/footerlinks.php";?>
<?php include "includes/cart_functions.php";?>
<script>
function change_stars(stars) {
for (var i=1;i<=stars;i++) {
$('#fa-star-'+i).attr('class', 'fa fa-star');
}
for (var i=stars+1;i<=5;i++) {
$('#fa-star-'+i).attr('class', 'fa fa-star-o');
}
$('#review_stars').val(stars);
}
get_reviews();
function get_reviews() {
$('#show_reviews_loading').html('<br><h5><i class="fa fa-spinner fa-spin"></i></h5>');
$.ajax({
url : 'ajax.php',
type : 'post',
data : {
'get_reviews' : 1,
'reviews_limit' : <?php echo $reviews_limit ?>,
'product_id' : <?php echo $product_id ?>,
'reviews_offset' : $('#reviews_offset').val()
},
success : function (res) {
$('#show_reviews_loading').html('');
$('#show_reviews_here').append(res);
$('#reviews_offset').val(parseInt($('#reviews_offset').val())+parseInt(<?php echo $reviews_limit ?>));
}
});
}
</script>
</body></html>
Back to Directory
File Manager