# 📋 Manual do Sistema de Banners - Culturando

## Visão Geral

O sistema de banners do Culturando permite gerenciar espaços publicitários de forma profissional, com agendamento automático, rastreamento de cliques e posições pré-definidas no layout.

## 📍 Posições Disponíveis

Posição | Dimensões | Onde Aparece | Uso Recomendado
--- | --- | --- | ---
Banner no header da home | 728 × 90 px | Topo da página inicial | Destaque principal, marca institucional
Barra lateral | 300 × 250 px | Sidebar (coluna lateral) | Anúncios secundários, chamadas complementares
Rodapé do site | 728 × 90 px | Rodapé de todas as páginas | Patrocinadores, links institucionais
Meio do conteúdo | 300 × 250 px | Entre parágrafos de posts/páginas | Integração orgânica com o conteúdo
Destaque da semana | 1200 × 400 px | Área especial de destaque | Promoções temporárias, eventos especiais

## ➕ Como Adicionar um Novo Banner

### Passo 1: Acessar o Painel

1. No menu lateral do WordPress, clique em Banners → Adicionar novo

### Passo 2: Preencher Informações Básicas

- Título: Nome do anunciante ou campanha (ex: “Restaurante Sabor Caseiro”)
- Conteúdo (opcional): Descrição ou texto complementar (aparece apenas na posição “Destaque da semana”)

### Passo 3: Definir Dados do Banner

Na caixa Dados do Banner, preencha:

Campo | Obrigatório? | Descrição
--- | --- | ---
URL de destino | ✅ Sim | Link completo (https://…) para onde o usuário será direcionado ao clicar
Posição no site | ✅ Sim | Selecione onde o banner será exibido (veja tabela acima)
Target | Opcional | `_blank` (abre em nova aba) ou `_self` (mesma aba). Padrão: `_blank`
Data inicial | Opcional | Deixe em branco para exibir imediatamente. Preencha para agendar publicação futura
Data final | Opcional | Deixe em branco para exibição indefinida. Preencha para expiração automática

### Passo 4: Imagem Destacada

1. No box Imagem destacada (coluna direita), clique em Definir imagem destacada
2. Faça upload da imagem já nas dimensões exatas da posição escolhida
3. Clique em Definir como imagem destacada

⚠️ IMPORTANTE: A imagem DEVE ter as dimensões exatas da posição. Verifique a tabela no início deste manual.

### Passo 5: Publicar

Clique em Publicar (ou Agendar, se definiu data inicial futura).

## 🎯 Comportamento do Banner

### ✅ Vigência Automática

- Sem datas definidas: Banner fica no ar indefinidamente (até ser excluído ou ter status alterado para “Rascunho”)
- Apenas data final: Banner aparece imediatamente e expira automaticamente na data/hora definida
- Apenas data inicial: Banner é agendado e entra no ar automaticamente na data/hora definida
- Ambas as datas: Banner entra e sai do ar automaticamente conforme o período definido

🕐 Fuso horário: O sistema usa o horário configurado em Configurações → Geral do WordPress.

### 📊 Rastreamento de Cliques

Cada vez que um visitante clica no banner:

- O sistema registra o clique automaticamente
- O usuário é redirecionado para a URL de destino
- O contador é atualizado em tempo real

📈 Para visualizar: Em Banners → Todos os banners, passe o mouse sobre o título do banner para ver o número de cliques.

### 🎲 Exibição Aleatória

Se houver múltiplos banners ativos na mesma posição:

- Eles são exibidos de forma aleatória (rodízio)
- Cada recarregamento de página pode mostrar um banner diferente
- Use o campo “Ordem” (se disponível) para priorizar banners específicos

## 📐 Por Que o Tamanho Exato é Crucial?

### ❌ Problemas com Imagens Fora do Tamanho

Situação | Consequência
--- | ---
Imagem maior | O sistema corta automaticamente (`object-fit: cover`), podendo remover partes importantes (texto, logo, bordas)
Imagem menor | O banner fica com espaço vazio, bordas esticadas ou qualidade comprometida
Proporção diferente | A imagem é distorcida, ficando “achatada” ou “esticada”

### ✅ Benefícios do Tamanho Correto

- Layout estável: Sem quebras ou ajustes inesperados
- Qualidade preservada: Imagem nítida e profissional
- Performance: Arquivo otimizado carrega mais rápido
- Previsibilidade: O anunciante vê exatamente como ficará

## 🛠️ Melhores Práticas

### Para a Equipe de Criação

1. Sempre trabalhe no tamanho exato da posição (use Photoshop, Canva, GIMP, etc.)
2. Formato recomendado: JPG para fotos, PNG para logos com transparência
3. Peso máximo: 150KB (ideal: menos de 100KB)
4. Margem de segurança: Deixe 5-10px de “respiro” nas bordas (evita cortes em telas menores)
5. Texto legível: Fonte mínima 14px para leitura em mobile
6. CTA claro: Inclua “Saiba mais”, “Confira”, “Acesse agora”, etc.

### Para o Gerente de Conteúdo

1. Valide a imagem antes de publicar: Confira dimensões e peso
2. Teste o link: Clique no banner após publicar para garantir que o destino está correto
3. Revise datas de vigência: Evite banners expirados ocupando espaço
4. Monitore cliques: Banners com poucos cliques podem precisar de redesign ou reposicionamento
5. Comunique parceiros: Oriente anunciantes sobre os tamanhos e formatos aceitos

## 🔧 Solução de Problemas Comuns

### “Meu banner não aparece”

✅ Verifique:

- Status está “Publicado” (não “Rascunho” ou “Pendente”)
- Data inicial já passou (ou está em branco)
- Data final ainda não expirou (ou está em branco)
- A posição selecionada existe no tema
- Há espaço disponível no layout para aquela posição

### “A imagem está cortada/distorcida”

✅ Solução:

- Redimensione a imagem exatamente para as dimensões da posição
- Use a ferramenta de crop do Photoshop/Canva com as medidas exatas
- Reenvie a imagem destacada

### “O link não funciona”

✅ Verifique:

- A URL de destino está completa (começa com `https://`)
- Não há espaços em branco no início/fim da URL
- O destino está acessível (teste em nova aba)

### “Quero trocar o banner de posição”

✅ Procedimento:

1. Edite o banner
2. Altere o campo “Posição no site”
3. Importante: Verifique se a imagem tem o tamanho correto para a NOVA posição
4. Atualize

## 📞 Suporte e Dúvidas

Para solicitações de novas posições, ajustes de layout ou relatórios avançados de cliques, entre em contato com a equipe de desenvolvimento.

Última atualização: Abril 2026
Versão do sistema: 1.0