Até agora, criamos nossas views de forma individual, o que pode levar a código duplicado e dificultar a manutenção do projeto. Para melhorar a estrutura do layout, vamos criar um template base para padronizar todas as páginas da aplicação.
Criando um Layout Base
No diretório app/Views/, crie um novo arquivo chamado layout.php. Esse arquivo servirá como estrutura padrão para todas as páginas do site.
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= $titulo ?? 'Meu Site' ?></title>
<link rel="stylesheet" href="<?= base_url('assets/css/style.css') ?>">
</head>
<body>
<header>
<h1>Meu Site CodeIgniter</h1>
<nav>
<a href="<?= site_url('/') ?>">Home</a> |
<a href="<?= site_url('servicos') ?>">Serviços</a> |
<a href="<?= site_url('quem-somos') ?>">Quem Somos</a> |
<a href="<?= site_url('contato') ?>">Contato</a>
</nav>
</header>
<main>
<?= $this->renderSection('conteudo') ?>
</main>
<footer>
<p>© <?= date('Y') ?> Meu Site - Todos os direitos reservados.</p>
</footer>
</body>
</html>
Esse template define um cabeçalho, uma área de navegação e um rodapé. O conteúdo das páginas será inserido dentro da seção conteudo.
Adaptando as Views para Usar o Template
Agora, em cada view do site, utilizamos o template base para evitar a repetição de código. Por exemplo, no arquivo app/Views/paginas/home.php, alteramos para:
<?php $this->extend('layout'); ?>
<?php $this->section('conteudo'); ?>
<h2>Bem-vindo ao nosso site!</h2>
<p>Aqui você encontrará informações sobre nossos serviços.</p>
<?php $this->endSection(); ?>
Agora, todas as páginas do site seguirão o mesmo layout sem a necessidade de repetir a estrutura do HTML.
Melhorando o Layout da Área Administrativa
Podemos criar um layout específico para o painel administrativo. No diretório app/Views/admin/, crie um arquivo layout_admin.php:
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin - <?= $titulo ?? 'Painel' ?></title>
<link rel="stylesheet" href="<?= base_url('assets/css/admin.css') ?>">
</head>
<body>
<header>
<h1>Painel Administrativo</h1>
<nav>
<a href="<?= site_url('admin/posts') ?>">Gerenciar Posts</a> |
<a href="<?= site_url('logout') ?>">Sair</a>
</nav>
</header>
<main>
<?= $this->renderSection('conteudo') ?>
</main>
<footer>
<p>© <?= date('Y') ?> Painel Admin - Todos os direitos reservados.</p>
</footer>
</body>
</html>
Agora, as views administrativas podem utilizar esse template. Por exemplo, alteramos app/Views/admin/posts/lista.php para:
<?php $this->extend('admin/layout_admin'); ?>
<?php $this->section('conteudo'); ?>
<h2>Gerenciar Posts</h2>
<a href="<?= site_url('admin/posts/novo') ?>">Criar Novo Post</a>
<?php foreach ($posts as $post) : ?>
<p><strong><?= esc($post['titulo']) ?></strong></p>
<a href="<?= site_url('admin/posts/editar/'.$post['id']) ?>">Editar</a> |
<a href="<?= site_url('admin/posts/excluir/'.$post['id']) ?>" onclick="return confirm('Tem certeza?');">Excluir</a>
<?php endforeach; ?>
<?php $this->endSection(); ?>
Conclusão
Agora temos um layout unificado para o site e para a área administrativa, tornando a estrutura mais organizada e fácil de manter.
No próximo post, vamos reforçar a segurança do sistema, protegendo ações sensíveis e melhorando o controle de acessos.
Se você ou sua empresa precisa de suporte para desenvolvimento com CodeIgniter 4, a Saldaris Consultoria pode ajudar. Entre em contato pelo formulário no final da página para saber mais sobre nossos serviços.
Erro: Formulário de contato não encontrado.
