131 lines
8.2 KiB
PHP
131 lines
8.2 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<title>Post Title - My Blog</title>
|
|
<meta name="description" content="A detailed article about...">
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🚀</text></svg>">
|
|
|
|
<!-- Stylesheets -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" 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=Inter:wght@400;500;600;700&family=Lora:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
|
</head>
|
|
<body>
|
|
|
|
<?php
|
|
// Hardcoded post data as a substitute for a database
|
|
$posts = [
|
|
[
|
|
"id" => 1,
|
|
"title" => "The Future of Web Development",
|
|
"content" => "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh.</p><p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis. Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>",
|
|
"image" => "https://picsum.photos/seed/tech/1200/600",
|
|
"alt" => "Abstract technology background",
|
|
"category" => "Technology",
|
|
"date" => "September 29, 2025",
|
|
"author" => "Admin"
|
|
],
|
|
[
|
|
"id" => 2,
|
|
"title" => "A Guide to Mindful Productivity",
|
|
"content" => "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh.</p><p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis. Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>",
|
|
"image" => "https://picsum.photos/seed/writing/1200/600",
|
|
"alt" => "A person writing in a notebook",
|
|
"category" => "Productivity",
|
|
"date" => "September 25, 2025",
|
|
"author" => "Admin"
|
|
],
|
|
[
|
|
"id" => 3,
|
|
"title" => "Exploring Urban Landscapes",
|
|
"content" => "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat. Duis semper. Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim. Pellentesque congue. Ut in risus volutpat libero pharetra tempor. Cras vestibulum bibendum augue. Praesent egestas leo in pede. Praesent blandit odio eu enim. Pellentesque sed dui ut augue blandit sodales. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh.</p><p>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis. Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.</p>",
|
|
"image" => "https://picsum.photos/seed/city/1200/600",
|
|
"alt" => "Cityscape at dusk",
|
|
"category" => "Travel",
|
|
"date" => "September 22, 2025",
|
|
"author" => "Admin"
|
|
]
|
|
];
|
|
|
|
$postId = isset($_GET['id']) ? (int)$_GET['id'] : 0;
|
|
$post = null;
|
|
foreach ($posts as $p) {
|
|
if ($p['id'] === $postId) {
|
|
$post = $p;
|
|
break;
|
|
}
|
|
}
|
|
|
|
// Redirect to home if post not found
|
|
if ($post === null) {
|
|
header("Location: /");
|
|
exit;
|
|
}
|
|
?>
|
|
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm sticky-top">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="/">My Blog</a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto">
|
|
<li class="nav-item"><a class="nav-link" href="/">Home</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">About</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">Contact</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="container mt-5 mb-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8">
|
|
<article class="post-full">
|
|
<header class="post-header">
|
|
<div class="post-meta mb-2">
|
|
<span><?php echo htmlspecialchars($post['category']); ?></span>
|
|
</div>
|
|
<h1 class="post-title"><?php echo htmlspecialchars($post['title']); ?></h1>
|
|
<div class="post-meta">
|
|
By <?php echo htmlspecialchars($post['author']); ?> • <?php echo htmlspecialchars($post['date']); ?>
|
|
</div>
|
|
</header>
|
|
|
|
<figure class="post-featured-image my-4">
|
|
<img src="<?php echo htmlspecialchars($post['image']); ?>" alt="<?php echo htmlspecialchars($post['alt']); ?>">
|
|
</figure>
|
|
|
|
<section class="post-content">
|
|
<?php echo $post['content']; // Content is sanitized in a real app ?>
|
|
</section>
|
|
|
|
<footer class="post-footer mt-5">
|
|
<a href="/" class="btn btn-outline-primary">Back to Blog</a>
|
|
</footer>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<div class="container text-center">
|
|
<p>© <?php echo date("Y"); ?> My Blog. All Rights Reserved.</p>
|
|
<p><a href="#">Privacy Policy</a> | <a href="#">Terms of Service</a></p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
|
|
</body>
|
|
</html>
|