Seções e contêineres
Seções e contêineres são a base estrutural das páginas construídas em Atomicat.
Uma seção é um bloco importante da página. Um contêiner fica dentro de uma seção ou outro contêiner e contém elementos da página, como texto, imagens, botões, formulários, vídeos e outros componentes.
Como funcionam seções e contêineres
As páginas Atomicat são armazenadas como uma estrutura aninhada. O construtor usa essa estrutura para renderizar a tela da página, mostrar itens no Navegador e preservar o layout ao salvar ou publicar.
| Item de estrutura | Finalidade |
|---|---|
| Seção | Área da página principal, como herói, benefícios, depoimentos, preços, perguntas frequentes ou rodapé. |
| Container | Wrapper de layout usado para agrupar e alinhar elementos dentro de uma seção. |
| Elemento | O conteúdo visível ou interação colocada dentro de um contêiner. |
Quando usar uma seção
Use uma seção ao criar uma nova parte principal da página.
Exemplos:
- Área heróica
- Benefícios do produto
- Prova social
- Carta de vendas em vídeo
- Formulário de captura de leads
- Bloco de preços ou ofertas
- FAQ
- Rodapé
Quando usar um contêiner
Use contêineres para organizar o layout dentro de uma seção.
Exemplos comuns:
- Um layout de destaque de duas colunas com texto de um lado e mídia do outro.
- Uma fileira de cartões de benefícios.
- Um bloco de formulário centralizado dentro de uma seção.
- Uma área aninhada que agrupa elementos de imagem, título, descrição e botão. Os contêineres
são especialmente importantes para o design responsivo porque controlam como os elementos filhos se alinham, empilham e dimensionam nas visualizações de desktop, tablet e dispositivos móveis.
Selecionando seções e containers
Você pode selecionar seções e containers diretamente na tela ou através do Navegador.
Use o Navegador quando:
- O elemento está profundamente aninhado.
- Vários contêineres se sobrepõem visualmente.
- Você precisa entender a hierarquia de páginas.
- Você deseja reordenar itens com mais precisão.
Considerações sobre layout responsivo
Ao criar páginas responsivas:
- Mantenha o aninhamento o mais superficial possível.
- Use contêineres para agrupar elementos que devem permanecer juntos.
- Verifique a visualização móvel após alterar larguras, alinhamento, espaçamento ou ordem.
- Evite usar recipientes vazios desnecessários.
- Use espaçamento consistente entre seções repetidas.
Melhores práticas
- Construa desde uma estrutura ampla até um estilo detalhado.
- Mantenha os elementos relacionados no mesmo contêiner.
- Use o Navegador para confirmar se os elementos estão colocados onde você espera.
- Salvar após grandes mudanças estruturais.
Documentos relacionados
Perguntas frequentes
Quando devo usar esta página sobre Seções e Contêineres — Construtor de páginas?
Use esta página quando precisar entender o fluxo, as configurações ou as decisões relacionadas a Seções e Contêineres — Construtor de páginas. Ela é mais útil antes de editar um recurso em produção, publicar alterações ou revisar o comportamento em um workspace Atomicat.
O que devo conferir antes de alterar Seções e Contêineres — Construtor de páginas?
Confirme que você está no workspace, projeto, página, funil, site ou área da conta correta. Revise permissões, alterações salvas, status de publicação e integrações conectadas antes de atualizar.
Como verifico se Seções e Contêineres — Construtor de páginas está funcionando corretamente?
Pré-visualize a página ou recurso afetado, teste o caminho principal em uma nova sessão do navegador e confirme que formulários, redirecionamentos, rastreamento, produtos, quizzes ou publicação funcionam como esperado.
O que faço se Seções e Contêineres — Construtor de páginas não funcionar como esperado?
Revise novamente a configuração descrita nesta página, salve as alterações outra vez, limpe o cache do navegador se necessário e teste uma versão simples da configuração. Se continuar, reúna a URL, detalhes do workspace e capturas antes de contatar o suporte.