Componente Lista de Atributos
O bloco Lista de Atributos foi pensado para apresentar, de forma rápida e organizada, os valores de um atributo específico dentro da página. Permite escolher o atributo a listar, definir o estilo de apresentação em horizontal ou vertical e ajustar a estrutura base do bloco com opções de skin, identificação técnica e espaçamentos.
Informações gerais
O bloco Lista de Atributos é uma solução direta para expor um conjunto de valores associados a um atributo sem necessidade de montar uma estrutura manual item a item. Funciona bem para características técnicas, tags de classificação, propriedades de produto, filtros descritivos ou listas curtas de apoio editorial.
Este bloco pode incluir:
- seleção do atributo através do campo Attribute to List
- definição do padrão visual com List Style, normalmente horizontal ou vertical
- controlo estrutural através de Skin, Disabled block, Block ID e Extra Class
- ajustes de integração no layout com Margin e Padding
Utiliza este componente quando precisas de mostrar um atributo de forma consistente, reaproveitando a informação já existente no sistema. É especialmente útil em páginas de produto, catálogos, fichas técnicas, blocos de apoio à decisão ou secções em que o utilizador precisa de identificar rapidamente um conjunto de valores relacionados.
Exemplos visuais do bloco
3 leituras possíveis para a mesma lógica
O bloco Lista de Atributos pode assumir leituras diferentes consoante o tipo de valores apresentados e o estilo escolhido em List Style. Os três exemplos abaixo mostram como a mesma lógica pode servir contextos mais rápidos, mais técnicos ou mais editoriais.
Quando usar / Quando evitar
Aplicação correta do componente
Quando usar
- Para apresentar os valores de um atributo já existente de forma clara e reutilizável
- Quando precisas de mostrar materiais, características, tags, propriedades ou classificações
- Quando queres evitar repetir manualmente a mesma lista em várias páginas
- Quando a informação ganha valor por estar agrupada numa leitura horizontal ou vertical consistente
Quando evitar
- Quando a informação precisa de ordem, narrativa ou hierarquia própria que não depende de um atributo
- Quando os valores são demasiado longos e exigem um bloco de texto mais desenvolvido
- Quando o conteúdo a mostrar não existe como atributo estruturado no sistema
Como usar na prática
Sequência de trabalho recomendada
Escolher o atributo
- Confirmar qual é o atributo certo para a necessidade da página
- Verificar se os valores desse atributo estão atualizados e coerentes entre si
Definir o estilo
- Usar List Style horizontal para valores curtos e leitura imediata
- Usar List Style vertical quando os valores precisam de mais espaço ou maior legibilidade
Ajustar a estrutura
- Configurar Skin, Disabled block, Block ID e Extra Class de acordo com o layout
- Usar Margin e Padding para integrar o bloco no ritmo geral da composição
Validar no preview
- Confirmar se a quantidade de valores continua legível no espaço disponível
- Verificar se o estilo horizontal ou vertical continua coerente em desktop e mobile
Boas práticas de conteúdo
Consistência, utilidade e leitura
Qualidade dos valores
- Garante que os valores do atributo seguem a mesma lógica de escrita e o mesmo nível de detalhe
- Evita misturar valores muito curtos com descrições demasiado longas dentro da mesma lista
- Se existirem abreviações, confirma que fazem sentido para o público da página
Escolha do estilo
- Prefere o estilo horizontal quando a função é resumir, filtrar ou reforçar leitura rápida
- Prefere o estilo vertical quando a função é explicar, detalhar ou acomodar valores mais extensos
- Não forces demasiados valores numa única linha se isso comprometer a leitura do conjunto
Configurações avançadas do componente Lista de Atributos
Estrutura base e integração no layout
Estas opções controlam a estrutura base do bloco, a sua identificação técnica e a forma como se encaixa no restante layout.
Estrutura base
- Skin define a variante visual base do componente
- Disabled block permite desativar o bloco sem o remover
- Block ID ajuda em âncoras, navegação interna e referência técnica
- Extra Class permite acrescentar uma classe adicional para ajustes específicos
Espaçamentos
- Margin controla a distância do bloco em relação aos elementos exteriores
- Padding controla a respiração interna do conteúdo
- Estes campos ajudam a fazer o bloco respirar melhor em composições mais densas ou mais abertas
Leitura no layout
- A combinação entre estrutura e espaçamento define se a lista se lê como detalhe técnico ou como reforço visual
- Uma configuração mais contida costuma resultar melhor quando a lista aparece entre outros blocos informativos
- Uma configuração mais aberta ajuda quando os valores precisam de ganhar destaque por si só
Configuração do conteúdo principal
Atributo a listar e tipo de apresentação
Na configuração principal do bloco defines que atributo deve ser mostrado e de que forma ele será apresentado ao utilizador.
Attribute to List
- O campo Attribute to List indica qual é o atributo cujos valores serão apresentados no bloco
- É importante escolher um atributo que já esteja corretamente preenchido e coerente nos conteúdos ou produtos onde vai ser usado
- Quanto mais consistente for a origem dos valores, mais robusta será a apresentação final
List Style
- O campo List Style define se os valores aparecem numa lógica mais horizontal ou mais vertical
- Horizontal funciona melhor para listas curtas, compactas e de leitura rápida
- Vertical funciona melhor quando os valores precisam de mais espaço, mais separação ou maior legibilidade
Guias relacionados
Documentação que pode complementar este bloco