4WDCSA.co.za/blog_read.php

<?php include_once('header02.php');

$token = $_GET['token'];
// Sanitize the trip_id to prevent SQL injection
$blog_id = intval(decryptData($token, $salt)); // Ensures $trip_id is treated as an integer


$page_id = 'blog_'.$blog_id;
echo getCommentCount($page_id);


$stmt = $conn->prepare("
    SELECT a.title, a.category, a.description, a.content, a.date,
           u.first_name, u.last_name
    FROM blogs a
    JOIN users u ON a.author = u.user_id
    WHERE a.blog_id = ?
");
$stmt->bind_param("i", $blog_id);
$stmt->execute();
$result = $stmt->get_result();

if ($result->num_rows === 0) {
    die("Article not found.");
}

$row = $result->fetch_assoc();
$author = htmlspecialchars($row['first_name'] . ' ' . $row['last_name']);
?>


<style>
    .image {
        width: 400px;
        /* Set your desired width */
        height: 350px;
        /* Set your desired height */
        overflow: hidden;
        /* Hide any overflow */
        display: block;
        /* Ensure proper block behavior */
    }

    .image img {
        width: 100%;
        /* Image scales to fill the container */
        height: 100%;
        /* Image scales to fill the container */
        object-fit: cover;
        /* Fills the container while maintaining aspect ratio */
        object-position: top;
        /* Aligns the top of the image with the top of the container */
        display: block;
        /* Prevents inline whitespace issues */
    }
</style>
<style>
    body {
        /* font-family: Arial, sans-serif; */
        line-height: 1.6;
        /* max-width: 800px; */
        margin: auto;
        /* padding: 20px; */
    }

    h1,
    h2 {
        color: #2c3e50;
    }

    h2 {
        margin-top: 2em;
    }

    .content {
        margin-bottom: 2em;
    }

    .img-left,
    .img-right {
        max-width: 30%;
        margin: 20px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        border-radius: 10px;
    }

    .img-left {
        float: left;
    }

    .img-right {
        float: right;
    }

    .clearfix {
        clear: both;
    }

</style>

<?php
$bannerFolder = 'assets/images/banners/';
$bannerImages = glob($bannerFolder . '*.{jpg,jpeg,png,webp}', GLOB_BRACE);

$randomBanner = 'assets/images/base4/camping.jpg'; // default fallback
if (!empty($bannerImages)) {
    $randomBanner = $bannerImages[array_rand($bannerImages)];
}
?>
<section class="page-banner-area pt-50 pb-35 rel z-1 bgs-cover" style="background-image: url('<?php echo $randomBanner; ?>');">
    <div class="banner-overlay"></div>
    <div class="container">
        <div class="banner-inner text-white">
            <h2 class="page-title mb-10" data-aos="fade-left" data-aos-duration="1500" data-aos-offset="50"><?= htmlspecialchars($row['title']) ?></h2>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb justify-content-center mb-20" data-aos="fade-right" data-aos-delay="200" data-aos-duration="1500" data-aos-offset="50">
                    <li class="breadcrumb-item"><a href="index.php">Home</a></li>
                    <li class="breadcrumb-item active"><?= htmlspecialchars($row['title']) ?></li>
                </ol>
            </nav>
        </div>
    </div>
</section>
<!-- Page Banner End -->


<!-- Blog Detaisl Area start -->
<section class="blog-detaisl-page py-100 rel z-1">
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
                <div class="blog-details-content" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
                    <a href="blog.html" class="category"><?= htmlspecialchars($row['category']) ?></a>
                    <ul class="blog-meta mb-30">
                        <li><img src="assets/images/pp/default.png" alt="Admin"> <a href="#"><?= $author?></a></li>
                        <li><i class="far fa-calendar-alt"></i> <a href="#"><?= htmlspecialchars($row['date']) ?></a></li>
                        <li><i class="far fa-comments"></i> <a href="#">Comments (<?= getCommentCount($page_id);?>)</a></li>
                    </ul>
                    
                    <?= $row['content'] ?>                    
                </div>
                <hr class="mb-45">
                <div class="tag-share mb-50">
                    <div class="item" data-aos="fade-left" data-aos-duration="1500" data-aos-offset="50">
                        <h6>Tags </h6>
                        <div class="tag-coulds">
                            <a href="blog.php"><?= htmlspecialchars($row['category']) ?></a>                            
                        </div>
                    </div>
                </div>               
                <?php include_once('comment_box.php'); ?>
            </div>
            <div class="col-lg-4 col-md-8 col-sm-10 rmt-75">
                <div class="blog-sidebar">   
                    <div class="widget widget-gallery" data-aos="fade-up" data-aos-duration="1500" data-aos-offset="50">
                        <h5 class="widget-title">Gallery</h5>
                        <div class="gallery">
                            <?php
                            $folder = 'uploads/blogs/'.$blog_id.'/images/';
                            $files = glob($folder . '*.{jpg,jpeg,png,webp}', GLOB_BRACE);
                            shuffle($files); // Randomize the order

                            foreach ($files as $file) {
                                echo '<a href="' . $file . '" style="width: 110px; height: 110px; overflow: hidden; display: inline-block; margin: 2px;">';
                                echo '<img src="' . $file . '" alt="Gallery" style="width: 100%; height: 100%; object-fit: cover; display: block;">';
                                echo '</a>';
                            }
                            ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<?php include_once("insta_footer.php"); ?>