1#@!#!123s

: / home3 / encodto1 / newpcjewellers.in /
Filename : product-details.php
back
<?php
// dbcon.php - Database connection file
include('config.php');

// Fetch the product ID from the URL or form submission
$product_id = $_GET['id'];

// Fetch product details from the database
$query = "SELECT * FROM products WHERE id = ?";
$stmt = $conn->prepare($query);
$stmt->bind_param("i", $product_id);
$stmt->execute();
$result = $stmt->get_result();
$product = $result->fetch_assoc();

// Assign product details to variables
$product_name = htmlspecialchars($product['name']);
$image_url = htmlspecialchars($product['image1']);
$image2_url = htmlspecialchars($product['image2']); // Additional images
$image3_url = htmlspecialchars($product['image3']);
$image4_url = htmlspecialchars($product['image4']);
$product_category = htmlspecialchars($product['category']);
$product_description = htmlspecialchars($product['details']);

?>
<!DOCTYPE html>
<html lang="en">

<meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>New PC Jewellers</title>
    <!--Favicons-->
    <link rel="icon" type="image/png" sizes="32x32" href="images/favicon.png">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="theme-color" content="#ffffff">
    <!--Bootstrap and Other Vendors-->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/bootstrap-datepicker.min.css">
    <link rel="stylesheet" href="css/jquery.fancybox.min.css" />
    <link rel="stylesheet" href="css/jquery-ui.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
        rel="stylesheet">
    <link rel="stylesheet" href="css/fontawesome-all.min.css">
    <link rel="stylesheet" href="vendors/owl.carousel/css/owl.carousel.min.css">

    <link rel="stylesheet" type="text/css" href="vendors/flexslider/flexslider.css" media="screen" />
    <!--Fonts-->
    <link href="https://fonts.googleapis.com/css2?family=Domine:wght@400;500;600;700&amp;display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&amp;display=swap" rel="stylesheet">


    <link rel="preconnect" href="https://fonts.googleapis.com/">
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400&amp;display=swap" rel="stylesheet">


    <!--Mechanic Styles-->
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/responsive.css">
    <style>
        .xzoom,
        .xzoom-gallery {
            height: 300px;
            /* Set this to your desired height */
            object-fit: cover;
            /* Ensures the image covers the element, maintaining aspect ratio */
            width: auto;
            /* Allows the width to adjust according to the height */
        }
        .fullgridDiv {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Ensures spacing between image and content */
    height: 450px; /* Set a fixed height for the boxes */
    border: 1px solid #ddd; /* Optional: add border to visualize box size */
    overflow: hidden; /* Ensures content does not overflow */
}

.fullgridBox_img {
    height: 200px; /* Set a fixed height for the image container */
    overflow: hidden; /* Ensures image fits within the container */
}

.fullgridBox_img img {
    width: 100%; /* Ensure the image takes the full width of its container */
    height: 100%; /* Ensure the image takes the full height of its container */
    object-fit: cover; /* Ensures the image covers the area without distortion */
    display: block; /* Remove any extra space below the image */
}

.fullgridBox_cont {
    padding: 15px; /* Adjust padding as needed */
    background: #fff; /* Optional: background color for the content area */
}

    </style>

</head>

<body class="home-2">
    <a href="#" id="back-to-top" title="Back to top">&uarr;</a>
    <div class="innerLayout">
        <?php require('header.php') ?>
        <section id="breadcrumbRow" class="row">
            <h2>Product Details</h2>
            <div class="row pageTitle m0">
                <div class="container">
                    <h4 class="fleft">product details</h4>
                    <ul class="breadcrumb">
                        <li><a href="index.php">home</a></li>
                        <li class="active">product</li>
                        <li>product details</li>
                    </ul>
                </div>
            </div>
        </section>






        <section class="row contentRowPad">
            <div class="container">
                <div class="row singleProduct">
                    <div class="col-md-6 col-sm-12 col-xs-12">
                        <div class="row m0">
                            <div class="xoom-container">
                                <!-- Main Product Image -->
                                <img src="newadminpc/uploads/<?php echo $image_url; ?>" class="xzoom" xoriginal="newadminpc/uploads/<?php echo $image_url; ?>">

                                <div class="xzoom-thumbs">
                                    <!-- Thumbnail Images -->
                                    <a href="newadminpc/uploads/<?php echo $image_url; ?>">
                                        <img class="xzoom-gallery" src="newadminpc/uploads/<?php echo $image_url; ?>" xpreview="newadminpc/uploads/<?php echo $image_url; ?>">
                                    </a>
                                    <a href="newadminpc/uploads/<?php echo $image2_url; ?>">
                                        <img class="xzoom-gallery" src="newadminpc/uploads/<?php echo $image2_url; ?>" xpreview="newadminpc/uploads/<?php echo $image2_url; ?>">
                                    </a>
                                    <a href="newadminpc/uploads/<?php echo $image3_url; ?>">
                                        <img class="xzoom-gallery" src="newadminpc/uploads/<?php echo $image3_url; ?>" xpreview="newadminpc/uploads/<?php echo $image3_url; ?>">
                                    </a>
                                    <a href="newadminpc/uploads/<?php echo $image4_url; ?>">
                                        <img class="xzoom-gallery" src="newadminpc/uploads/<?php echo $image4_url; ?>" xpreview="newadminpc/uploads/<?php echo $image4_url; ?>">
                                    </a>
                                    <!-- Add more images as needed -->
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6 col-sm-12 col-xs-12">
                        <!-- Existing Product Details Code -->
                        <div class="row m0">
                            <h2 class="heading"><?php echo $product_name; ?></h2>
                            <h5 class="jwell_cat"><i class="fas fa-tags"></i> <?php echo $product_category; ?></h5>
                            <ul class="jewelInfo">
                                <li><span>Metal: </span> <?php echo htmlspecialchars($product['metal']); ?></li>
                                <li><span>Purity: </span> <?php echo htmlspecialchars($product['purity']); ?></li>
                                <li><span>Weight: </span> <?php echo htmlspecialchars($product['weight']); ?> GM</li>
                            </ul>
                            <div class="row m0">
                                <div class="wce">
                                    <form action="#" method="POST">
                                        <input type="hidden" name="product_id" id="product_id" value="<?php echo $product_id; ?>">
                                        <button type="button" class="btn btn-danger btn-md" onclick="addto_wish()"><i class="far fa-heart"></i> Add to Wishlist </button>
                                    </form>
                                    <span class="text-danger d-block" id="responseData"></span>
                                </div>
                            </div>
                            <div class="row m0 shortDesc">
                                <p class="m0"><?php echo $product_description; ?></p>
                            </div>
                            <div class="row m0 form-inline">
                                <div class="form-group">
                                    <table class="productFormTable">
                                        <tbody>
                                            <tr>
                                                <td><label class="proAttr">Qty :</label></td>
                                                <td>
                                                    <div class="input-group spinner">
                                                        <input type="number" class="form-control" value="1" max="5" min="1">
                                                    </div>
                                                </td>
                                            </tr>
                                            <tr>
                                            <a href="order.php?product=<?php echo urlencode($product_id); ?>" class="btn btn-default">Place Order <i class="fas fa-paper-plane"></i> </a>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row m0 tabRow">
                    <!-- Existing Tabbed Content Code -->
                </div>
            </div>
        </section>

        <script>
            document.addEventListener('DOMContentLoaded', function() {
                // Base path for the image source
                var basePath = 'newadminpc/uploads/';

                // Select all thumbnail images
                var thumbnails = document.querySelectorAll('.xzoom-gallery');

                // Add click event listeners to each thumbnail
                thumbnails.forEach(function(thumbnail) {
                    thumbnail.addEventListener('click', function(e) {
                        e.preventDefault(); // Prevent the default link behavior

                        // Get the href attribute of the clicked thumbnail
                        var newImageSrc = this.getAttribute('href');
                        console.log('Thumbnail Href:', newImageSrc);

                        // Construct the full image path
                        var fullImageSrc = basePath + newImageSrc;
                        console.log('Full Image Src:', fullImageSrc);

                        // Find the main image element
                        var mainImage = document.querySelector('.xzoom');

                        // Update the src attribute of the main image
                        if (mainImage) {
                            mainImage.src = fullImageSrc;
                            mainImage.setAttribute('xoriginal', fullImageSrc);
                        }
                    });
                });
            });
        </script>




        <section class="row contentRowPad">
            <div class="headding-box">
                <h3 class="theme-headdings">Latest Related Jewelleries</h3>
                <div class="headding_icons">
                    <ul>
                        <li><span class="mar-top15"><i class="far fa-gem" aria-hidden="true"></i></span></li>
                        <li><span class="style mar-top15"><i class="far fa-gem" aria-hidden="true"></i></span></li>
                        <li><span class="mar-top15"><i class="far fa-gem" aria-hidden="true"></i></span></li>
                    </ul>
                </div>
                <p>Latest Related Products</p>
            </div>
            <div class="container">
                <div class="owl-carousel related_jewellery m0 owl_slider">

                    <?php
                    // Include your database connection file
                    include 'config.php'; // Adjust the path as needed

                    // Query to fetch the latest 8 products
                    $sql = "SELECT * FROM products ORDER BY id DESC LIMIT 8";
                    $result = mysqli_query($conn, $sql);

                    if (mysqli_num_rows($result) > 0) {
                        // Output data of each row
                        while ($row = mysqli_fetch_assoc($result)) {
                            $product_id = $row['id'];
                            $product_name = $row['name'];
                            $product_image = $row['image1']; // Assuming 'image' field contains the filename
                            $product_purity = htmlspecialchars($row['purity']);
                            $product_weight = htmlspecialchars($row['weight']);
                            $product_link = "product-details.php?id=" . urlencode($product_id);
                    ?>
                            <div class="item">
                                <div class="fullgridDiv">
                                    <a class="fullgridBox_inner" href="<?php echo $product_link; ?>">
                                        <div class="fullgridBox_img">
                                            <img alt="<?php echo htmlspecialchars($product_name); ?>" src="newadminpc/uploads/<?php echo htmlspecialchars($product_image); ?>">
                                        </div>
                                        <div class="fullgridBox_cont">
                                            <h3><?php echo htmlspecialchars($product_name); ?></h3>
                                            <ul class="list-inline jewelBox">
                                                <li>Purity: <span><?php echo $product_purity; ?></span></li>
                                                <li>Weight: <span><?php echo $product_weight; ?> GM</span></li>
                                            </ul>
                                            <a class="jewelAnchor" href="<?php echo $product_link; ?>">Explore Details <i class="fas fa-angle-right"></i></a>
                                        </div>
                                    </a>
                                </div>
                            </div>
                    <?php
                        }
                    } else {
                        echo "<p>No products found.</p>";
                    }

                    // Close the database connection
                    mysqli_close($conn);
                    ?>

                </div>
            </div>
        </section>

        <section class="social_sec">
            <div class="social_div">
                <ul class="sociallist">
               <li><a href="https://www.facebook.com/newpcjewellersslg01">
                     <img src="images/icons/facebook.png" alt="social-icon">
                  </a></li>
               <li><a href="https://www.instagram.com/newpcjewellerssiliguri/">
                     <img src="images/icons/instagram.png" alt="social-icon">
                  </a></li>
               
            </ul>
            </div>

            <div class="whatsapp_Div">
                <a class="video-vemo-icon" href="https://api.whatsapp.com/send/?phone=919734355000"><img src="images/icons/whatsapp.png"></a>
            </div>
        </section>91

        <?php require('footer.php') ?>

    </div>



    <!-- Button trigger modal -->
    <!-- <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
  Launch demo modal
</button> -->

    <div class="modal fade" id="LoginModal" tabindex="-1" role="dialog" aria-labelledby="LoginModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="modal-body">
                    <div class="accountDiv row">
                        <div class="col-6">
                            <div class="accountInfo">
                                <h3>Hello, Friend!</h3>
                                <p>Enter your personal details to start journey with us.</p>
                                <a href="#" class="btn btn-primary">Sign up</a>
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="accountForm">
                                <form action="#" method="POST">
                                    <div class="input-group">
                                        <input type="tel" name="" maxlength="10" placeholder="Enter Mobile Number">
                                    </div>
                                </form>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>


    <!--jQuery-->
    <script src="js/jquery-2.1.3.min.js"></script>
    <!--Bootstrap JS-->
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bootstrap-datepicker.min.js"></script>
    <script src="js/jquery.fancybox.min.js"></script>
    <script src="js/jquery-ui.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/zoom.js"></script>

    <!--Owl Carousel-->
    <script src="vendors/owl.carousel/js/owl.carousel.min.js"></script>
    <!--Isotope-->
    <script src="vendors/isotope/isotope-custom.js"></script>
    <script src="js/imagesloaded.pkgd.min.js"></script>
    <!--FlexSlider-->
    <script src="vendors/flexslider/jquery.flexslider-min.js"></script>
    <!--Regalia JS-->
    <script src="js/regalia.js"></script>
    <script async defer crossorigin="anonymous" src="../connect.facebook.net/en_US/sdk.js#xfbml=1&version=v11.0" nonce="wjI79STh"></script>
</body>

<!-- Mirrored from newpcjewellers.in/product-details?product=SjRBQkpnb3hIZXUwK1VVMXZNbHZVZz09 by HTTrack Website Copier/3.x [XR&CO'2014], Tue, 03 Sep 2024 09:29:40 GMT -->

</html>
<script>
    $(function() {
        $(".xzoom, .xzoom-gallery").xzoom({
            zoomWidth: 400,
            tint: "#333",
            Xoffset: 15,
        });
    });
</script>