Componente Texto
O bloco Texto permite criar conteúdo editorial e informativo, como introduções, descrições, instruções, listas, notas e textos de apoio.
Informações gerais
O bloco Texto permite criar conteúdo editorial e informativo, como introduções, descrições, instruções, listas, notas e textos de apoio. Ele serve de base para explicar ao utilizador o que está a visualizar e fornecer contexto às secções visuais, como Imagem, Mosaico e Tabs.
Exemplos visuais do bloco
Variações de layout e composição
O bloco Texto pode ser utilizado em diferentes contextos editoriais, mantendo sempre a mesma função principal: apresentar conteúdo de forma clara, legível e organizada. Os exemplos abaixo ajudam a perceber como este componente se adapta a introduções curtas, textos mais editoriais e composições com listas ou maior densidade informativa.
Como usar na prática
Quando usar e boas práticas
Quando usar
- Para introduzir uma secção, normalmente logo após um Título.
- Para explicar benefícios, detalhes, instruções e contexto.
- Para organizar informação em parágrafos curtos e/ou listas.
Boas práticas de conteúdo
- Utilize parágrafos curtos, com 2 a 4 linhas por parágrafo.
- Recomenda-se entre 50 e 120 palavras por bloco.
- Se o texto estiver extenso, divida em parágrafos, utilize listas com 3 a 5 itens e considere usar colunas.
Configurações do editor de texto
Regras de consistência
Imagem de referência do editor de texto utilizado no componente.
O que usar
- Estilos: mantenha a consistência utilizando opções como “Normal” e “Heading”.
- Negrito: destaque apenas 1 ou 2 palavras-chave.
- Listas: use marcadores ou listas numeradas para facilitar a leitura rápida.
- Links: utilize a opção de link para URLs e CTAs inline.
O que evitar
- Evite misturar tamanhos, fontes e cores em um mesmo bloco.
- Evite colar texto de Word ou Docs sem remover a formatação.
- Não utilize o bloco Texto para simular layouts; utilize blocos específicos para esse fim.
Configurações avançadas do componente Texto
Imagem + resumo das opções
Essas opções controlam a largura, as colunas, as cores, os espaçamentos e a animação.
Configurações gerais
- Skin aplica uma variante visual do texto, quando disponível no tema.
- Disabled block desativa o bloco sem excluí-lo.
- Full Width faz com que o bloco ocupe toda a largura disponível.
- Offset aplica deslocamento na grelha para criar efeito editorial.
- Block ID cria âncoras e navegação interna.
- Extra Class permite ajustes pontuais definidos pela equipa.
- Nº of Columns divide o texto em colunas.
Styles Button
- Margin controla o espaço externo e a separação entre secções.
- Padding controla o espaço interno do bloco.
- Background color ajuda a separar visualmente notas, manifestos ou destaques.
- Text color define a cor do texto e deve ser sempre validada com contraste.
Animation
- Animation on/off ativa ou desativa a animação.
- Scroll animation type define o tipo de animação conforme o tema.
- Recomenda-se utilizar animações simples e discretas, especialmente em páginas com muito conteúdo.
Configurações dos blocos no Studio Demo
Exemplos e downloads