CMS3

 <?php

/*
// Crear tabla si no existe
$createTableSQL = "
CREATE TABLE IF NOT EXISTS pages (
    id INT AUTO_INCREMENT PRIMARY KEY,
    title VARCHAR(255) NOT NULL,
    content TEXT NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
";

try {
    $pdo->exec($createTableSQL);
} catch (PDOException $e) {
    die("Error creando la tabla: " . $e->getMessage());
}

*/
// Configuración de la base de datos
$host = "localhost";
$dbname = "cms";
$username = "root";
$password = "";

try {
    $pdo = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
    die("Error en la conexión: " . $e->getMessage());
}

// Procesar formulario de creación de página
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $title = $_POST['title'] ?? '';
    $content = $_POST['content'] ?? '';

    if ($title && $content) {
        // Insertar nueva página en la base de datos
        $stmt = $pdo->prepare("INSERT INTO pages (title, content) VALUES (:title, :content)");
        $stmt->execute(['title' => $title, 'content' => $content]);
        echo "<div class='alert alert-success'>Página creada con éxito.</div>";
    } else {
        echo "<div class='alert alert-danger'>Por favor, completa todos los campos.</div>";
    }
}

// Obtener todas las páginas
$stmt = $pdo->query("SELECT * FROM pages");
$pages = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CMS Básico con Trumbowyg</title>
    <!-- Agregar Bootstrap para la interfaz -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Trumbowyg CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/trumbowyg@2.27.3/dist/ui/trumbowyg.min.css">
</head>
<body>

<div class="container mt-5">
    <h1 class="mb-4">CMS Básico con Trumbowyg</h1>

    <!-- Formulario para crear nueva página -->
    <h2>Crear Nueva Página</h2>
    <form method="POST" action="">
        <div class="mb-3">
            <label for="title" class="form-label">Título</label>
            <input type="text" class="form-control" id="title" name="title" required>
        </div>
        <div class="mb-3">
            <label for="content" class="form-label">Contenido</label>
            <textarea id="editor" name="content" class="form-control" required></textarea>
        </div>
        <button type="submit" class="btn btn-primary">Guardar</button>
    </form>

    <!-- Mostrar las páginas creadas -->
    <h2 class="mt-5">Páginas Creadas</h2>
    <ul class="list-group">
        <?php foreach ($pages as $page): ?>
            <li class="list-group-item">
                <a href="page.php?id=<?= $page['id'] ?>"> <?= htmlspecialchars($page['title']) ?> </a>
            </li>
        <?php endforeach; ?>
    </ul>
</div>

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<!-- Trumbowyg JS -->
<script src="https://cdn.jsdelivr.net/npm/trumbowyg@2.27.3/dist/trumbowyg.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/trumbowyg@2.27.3/dist/langs/es.min.js"></script>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

<script>
    $(document).ready(function() {
        $('#editor').trumbowyg({
            lang: 'es',
            btns: [
                ['viewHTML'],
                ['formatting'],
                ['bold', 'italic', 'underline'],
                ['superscript', 'subscript'],
                ['link'],
                ['insertImage'],
                ['unorderedList', 'orderedList'],
                ['justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull'],
                ['horizontalRule'],
                ['removeformat'],
                ['fullscreen']
            ]
        });
    });
</script>
</body>
</html>

Comentarios

Publicar un comentario