blog+contacto php listo

2026-09-20 13:28:57 -03:00
parent cd67fca3dc
commit cfb97b486e
24 changed files with 8970 additions and 165 deletions
@@ -0,0 +1,117 @@
+<?php
+require_once 'config/db.php';
+
+if (!isset($_GET['id'])) {
+    header('Location: blog.php');
+    exit;
+}
+
+// Obtener artículo
+$stmt = $pdo->prepare("
+    SELECT p.*, u.nombre as autor_nombre 
+    FROM blog_posts p 
+    LEFT JOIN admin_users u ON p.autor_id = u.id 
+    WHERE p.id = ? AND p.estado = 'publicado'
+");
+$stmt->execute([$_GET['id']]);
+$post = $stmt->fetch();
+
+if (!$post) {
+    header('Location: blog.php');
+    exit;
+}
+
+// Incrementar vistas
+$stmt = $pdo->prepare("UPDATE blog_posts SET vistas = vistas + 1 WHERE id = ?");
+$stmt->execute([$post['id']]);
+?>
+<!DOCTYPE html>
+<html lang="es" data-theme="light">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="description" content="<?= htmlspecialchars($post['extracto']) ?>">
+  <title><?= htmlspecialchars($post['titulo']) ?> | Blog Amor y Roma</title>
+  <link rel="stylesheet" href="style/main.css">
+  <style>
+    .articulo-header {
+      max-width: 900px;
+      margin: 0 auto;
+      padding: 4rem 2rem 2rem;
+    }
+    .articulo-imagen {
+      width: 100%;
+      max-height: 500px;
+      object-fit: cover;
+      border-radius: 16px;
+      margin: 2rem 0;
+    }
+    .articulo-contenido {
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 0 2rem 4rem;
+      font-size: 1.1rem;
+      line-height: 1.8;
+    }
+    .articulo-contenido h2,
+    .articulo-contenido h3 {
+      margin-top: 2.5rem;
+      margin-bottom: 1rem;
+    }
+    .articulo-contenido p {
+      margin-bottom: 1.5rem;
+    }
+    .articulo-contenido img {
+      max-width: 100%;
+      height: auto;
+      border-radius: 8px;
+      margin: 2rem 0;
+    }
+    .articulo-meta {
+      display: flex;
+      gap: 2rem;
+      color: #666;
+      font-size: 0.9rem;
+      margin: 1rem 0 2rem;
+      padding: 1rem 0;
+      border-top: 1px solid rgba(0, 63, 82, 0.12);
+      border-bottom: 1px solid rgba(0, 63, 82, 0.12);
+    }
+    .volver-link {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.5rem;
+      color: #ba124d;
+      text-decoration: none;
+      font-weight: 600;
+      margin-bottom: 2rem;
+    }
+  </style>
+</head>
+<body>
+  <div id="menu-container"></div>
+
+  <main>
+    <article>
+      <div class="articulo-header">
+        <a href="blog.php" class="volver-link">← Volver al blog</a>
+        <span class="badge-filosofia"><?= ucfirst(htmlspecialchars($post['categoria'])) ?></span>
+        <h1 style="font-size: clamp(2rem, 4vw, 3rem); margin: 1rem 0;"><?= htmlspecialchars($post['titulo']) ?></h1>
+        <div class="articulo-meta">
+          <span>📅 <?= date('d de F Y', strtotime($post['created_at'])) ?></span>
+          <span> <?= $post['tiempo_lectura'] ?> min de lectura</span>
+          <span>✍️ <?= htmlspecialchars($post['autor_nombre']) ?></span>
+        </div>
+        <img src="<?= htmlspecialchars($post['imagen']) ?>" alt="<?= htmlspecialchars($post['titulo']) ?>" class="articulo-imagen">
+      </div>
+      
+      <div class="articulo-contenido">
+        <?= $post['contenido'] ?>
+      </div>
+    </article>
+  </main>
+
+  <div id="footer-container"></div>
+  <script src="scripts/main.js"></script>
+</body>
+</html>