Resultados de aprendizagem

1. Compreender o que é um CMS e quando usar.
2. Instalar e configurar WordPress.
3. Personalizar temas e usar/criar plugins.
4. Comparar CMS tradicional vs headless.

CMS · definição

Content Management System — software que permite criar, gerir e publicar conteúdo sem programar cada página.

Separa:

• Conteúdo (textos, imagens) — gerido por editores.
• Apresentação (tema) — gerido por designers.
• Funcionalidade (plugins) — gerida por developers.

Quando usar CMS

Usar CMS:

• Blog, site institucional, loja.
• Cliente quer editar sem mexer em código.
• Time-to-market curto.

Não usar CMS (código próprio):

• App web com lógica complexa.
• Requisitos muito específicos.
• Performance extrema.

Panorama de CMS

Arquitectura WordPress

WordPress = PHP + MySQL

wp-admin/     → painel de administração
wp-content/   → temas, plugins, uploads
wp-includes/  → core
wp-config.php → configuração (BD, secrets)

Conteúdo na BD; ficheiros (imagens) em wp-content/uploads.

Instalação

Local (aprender):

• LocalWP, XAMPP, DDEV ou Docker.

Produção:

• Hosting com 1-click (Bluehost, SiteGround).
• VPS + LEMP (Linux, Nginx, MySQL, PHP).
• Managed WordPress (WP Engine, Kinsta).

5-minute install: descarregar → criar BD → wp-config.php → assistente web.

Configuração inicial

1. Permalinks → "Nome do post" (SEO).
2. Utilizadores — papéis (Admin, Editor, Author, Subscriber).
3. Definições gerais — título, idioma, fuso.
4. Apagar conteúdo demo, plugins não usados.
5. HTTPS + certificado.
6. Backup automático configurado.

Temas

• Tema controla layout e estilo.
• Milhares gratuitos no repositório oficial.
• Premium (Astra, GeneratePress, Kadence).
• Block themes (Full Site Editing) — editor visual moderno.

Child theme

wp-content/themes/
  meu-tema/             ← pai
  meu-tema-child/       ← filho
    style.css           (Template: meu-tema)
    functions.php

/*
Theme Name: Meu Tema Child
Template: meu-tema
*/

Personalizações ficam no filho; o pai pode actualizar sem perder nada.

Estrutura de tema (clássico)

header.php    → topo
footer.php    → rodapé
index.php     → fallback
single.php    → post individual
page.php      → página
archive.php   → listagens
functions.php → lógica do tema
style.css     → estilo

Template hierarchy: WordPress escolhe o ficheiro mais específico.

Plugins essenciais

Hooks · estender WordPress

// Action — executa código num momento
add_action('wp_footer', function() {
  echo '<p>Rodapé personalizado</p>';
});

// Filter — modifica um valor
add_filter('the_title', function($titulo) {
  return '★ ' . $titulo;
});

Hooks são a base de como plugins e temas estendem o core sem o modificar.

Tradicional vs Headless

Tradicional: CMS gere conteúdo e apresenta HTML.

Headless: CMS só gere conteúdo, expõe API (REST/GraphQL). O frontend é separado (React, Vue, app móvel).

Headless CMS  ──API──►  Site Next.js
              ──API──►  App Flutter
              ──API──►  Smart TV

Um conteúdo, vários canais.

Quando headless

Headless:

• Multi-canal (web + app + IoT).
• Frontend moderno (React/Vue).
• Equipa de developers.

Tradicional:

• Site simples, cliente edita tudo.
• Sem equipa técnica.
• Ecossistema de plugins resolve tudo.

WordPress também faz headless (REST API / WPGraphQL).

Hardening WordPress

1. Actualizar core, temas, plugins sempre.
2. Menos plugins, só de fontes confiáveis.
3. Senhas fortes + MFA no admin.
4. Limitar tentativas de login (plugin).
5. Mudar prefixo de tabelas e URL de login (segurança por obscuridade leve).
6. Backups automáticos e testados.
7. WAF (Wordfence, Cloudflare).
8. HTTPS obrigatório.
9. Remover utilizador "admin"; não usar admin para escrever.

Performance

• Cache (página, objecto, OPcache).
• CDN para estáticos.
• Imagens optimizadas (WebP, lazy load).
• Hosting adequado (não shared barato para tráfego real).
• Menos plugins pesados.
• Limpar BD (revisões, spam, transients).