Configuração de componentes padrão no modo de design

Última atualização em 2023-12-04

Tópicos
Authoring
Exibir mais informações sobre este tópico

Criado para:
User

Quando a instância do AEM é instalada imediatamente, uma seleção de componentes é disponibilizada imediatamente no navegador de componentes.

Além desses, vários outros componentes também estão disponíveis. Você pode usar o modo Design para ativar/desativar esses componentes. Quando ativado e localizado na sua página, você pode usar o modo Design para configurar aspectos do design do componente editando os parâmetros de atributo.

OBSERVAÇÃO

Tenha cuidado ao editar esses componentes. As configurações de design são geralmente parte integrante do design de todo o site, portanto, elas só devem ser alteradas por alguém com os privilégios e a experiência apropriados, geralmente um administrador ou um desenvolvedor. Consulte Desenvolvendo componentes para obter mais informações.

OBSERVAÇÃO

O modo Design está disponível somente para modelos estáticos. Os modelos criados com os modelos editáveis devem ser editados usando o editor de modelo.

OBSERVAÇÃO

O modo de design só está disponível para configurações de design armazenadas como conteúdo em ( /etc).

A partir do AEM 6.4, é recomendável armazenar designs como dados de configuração em /apps para suportar cenários de implantação contínua. Designs armazenados em /apps não são editáveis em tempo de execução e o modo Design não estará disponível para usuários não administradores desses modelos.

Isso envolve adicionar ou remover os componentes permitidos no sistema de parágrafo da página. O sistema de parágrafos ( parsys) é um componente composto que contém todos os outros componentes de parágrafo. O sistema de parágrafo permite que os autores adicionem componentes de diferentes tipos a uma página, pois ela contém todos os outros componentes de parágrafo. Cada tipo de parágrafo é representado como um componente.

Por exemplo, o conteúdo de uma página de produto pode conter um sistema de parágrafo que contenha o seguinte:

Uma imagem do produto (no formato de uma imagem ou de um parágrafo de imagem de texto)
A descrição do produto (como um parágrafo de texto)
Uma tabela com dados técnicos (como um parágrafo de tabela)
Um formulário que os usuários preenchem (no início dos formulários, elemento de formulários e parágrafo final dos formulários)

OBSERVAÇÃO

Consulte Desenvolvendo componentes e Diretrizes para o uso de modelos e componentes para obter mais informações sobre parsys.

ATENÇÃO

A edição do design usando o Modo de design conforme descrito neste artigo é a maneira recomendada de definir designs de modelos estáticos

A modificação de designs no CRX DE, por exemplo, não é a prática recomendada e a aplicação de tais designs pode variar do comportamento esperado. Consulte o documento do desenvolvedor Modelos de página - Estáticos para obter mais informações.

Ativar/desativar componentes

Para ativar ou desativar um componente:

Selecione o Design modo.
Clique em um componente. Quando selecionado, o componente tem uma borda azul.
Clique em Pai ícone.

Isso selecionará o sistema de parágrafo que contém o componente atual.
A variável Configurar O ícone do sistema de parágrafo é mostrado na barra de ação do pai.

Selecione esta opção para mostrar a caixa de diálogo.
Use a caixa de diálogo para definir os componentes disponíveis no navegador de componentes ao editar a página atual.

A caixa de diálogo tem duas guias:
- Componentes permitidos
- Configurações
Componentes permitidos

No Componentes permitidos você define quais componentes estão disponíveis para o parsys.
- Os componentes são agrupados por seus grupos de componentes, que podem ser expandidos e recolhidos.
- Um grupo inteiro pode ser selecionado ou desmarcados, marcando ou desmarcando o nome do grupo.
- Um sinal de menos representa pelo menos um, mas não todos os itens em um grupo estão selecionados.
- Há uma pesquisa disponível para filtrar um componente por nome.
- As contagens listadas à direita do nome do grupo de componentes representam o número total de componentes selecionados nesses grupos, independentemente do filtro.
Você define a configuração por componente de página. Se as páginas secundárias usarem o mesmo modelo e/ou componente de página (geralmente alinhado), a mesma configuração será aplicada ao sistema de parágrafo correspondente.

OBSERVAÇÃO

Os componentes do formulário adaptável são projetados para funcionar dentro do Contêiner de formulário adaptável para usar o ecossistema do Forms. Portanto, esses componentes devem ser usados somente no editor de formulário adaptável e não funcionarão no editor de páginas do Sites.

Configurações

No Configurações guia é possível definir opções adicionais, como desenhar uma âncora para cada componente e definir o preenchimento da célula de cada contêiner.
Selecionar Concluído para salvar sua configuração.

Configuração do design de um componente

Selecione o Design modo.
Clique em um componente com uma borda azul. Neste exemplo, um componente de imagem herói é selecionado.
Use o Configurar ícone para abrir o diálogo.

Na caixa de diálogo de design, é possível configurar o componente de acordo com os parâmetros de design disponíveis.

A caixa de diálogo tem três guias:
- Principal
- Recursos
- Estilos
Propriedades

A variável Propriedades permite configurar os parâmetros de design importantes do componente. Por exemplo, para um componente de imagem, é possível definir o tamanho máximo e mínimo da imagem permitida.

Recursos

A variável Recursos permite ativar ou desativar recursos adicionais do componente. Por exemplo, para um componente de imagem, é possível definir a orientação da imagem, as opções de corte disponíveis e se uma imagem pode ser carregada.

Estilos

A variável Estilos permite que você defina as classes e os estilos CSS a serem usados com o componente.

Use o Adicionar botão para adicionar entradas adicionais a uma lista de caixas de diálogo de várias entradas.

Use o Excluir ícone para remover uma entrada de uma lista de caixas de diálogo de várias entradas.

Use o Mover ícone para reorganizar a ordem das entradas em uma lista de caixas de diálogo de várias entradas.
Clique em Concluído ícone para salvar e fechar o diálogo.