Componente de Página page-component

O componente de Página é um componente de página extensível projetado para funcionar com o editor de modelo. Ele permite que o cabeçalho/rodapé da página e os componentes da estrutura sejam montados com o editor de modelo.

Uso usage

O componente de Página é a base de todas as páginas criadas com os Componentes principais e os modelos editáveis. Ao usar o componente de Página, os cabeçalhos, rodapés e a estrutura da página podem ser definidos como um modelo usando os outros Componentes principais.

Usando a caixa de diálogo design, as bibliotecas personalizadas do lado do cliente podem ser definidas para a página. Ao contrário de outros componentes que têm uma caixa de diálogo de edição acessível diretamente do componente, como o componente de Página é a própria página, a caixa de diálogo de edição do componente de Página é a janela de propriedades da página.

Versão e compatibilidade version-and-compatibility

A versão atual do componente de página é a v3, introduzida com a versão 2.18.0 dos componentes principais em fevereiro de 2022, e está descrita neste documento.

A tabela a seguir detalha todas as versões compatíveis do componente, as versões do AEM com as quais as versões do componente são compatíveis e os links para a documentação das versões anteriores.

Versão do componente
AEM 6.4
AEM 6.5
AEM as a Cloud Service
v3
-
Compatível
Compatível
v2
Compatível
Compatível
Compatível
v1
Compatível
Compatível
Compatível

Para mais informações sobre as versões dos Componentes principais, consulte o documento Versões dos Componentes principais.

Compatível com o Aplicativo web progressivo pwa-support

A versão 2.15.0 dos Componentes principais introduziu o suporte para recursos incorporados de Aplicativos web progressivos (PWA) do AEM as a Cloud Service. Com uma configuração simples no nível do site, transforme sua experiência AEM em um PWA!

Detalhes técnicos technical-details

A documentação técnica mais recente sobre o componente de Página pode ser encontrada no GitHub.

Mais detalhes sobre o desenvolvimento dos Componentes principais podem ser encontrados na documentação do desenvolvedor dos Componentes principais.

Caixa de diálogo de edição edit-dialog

Como o componente representa a página inteira, as configurações que normalmente estariam em uma caixa de diálogo de edição são encontradas na janela Propriedades da página.

Caixa de diálogo de design design-dialog

Como o componente representa a página inteira, a caixa de diálogo de design é acessada por meio de Informações da página -> Política da página ao editar o modelo da página.

Política da página

NOTE
Em versões anteriores do AEM, a Política de página era chamada de Design de página.

Guia Propriedades properties-tab

Usando a janela Design da página, você pode definir as bibliotecas de clientes a serem carregadas, bem como a biblioteca de recursos da Web para a página.

  • Bibliotecas do cliente - Isso define as categorias das bibliotecas de clientes a serem carregadas. O JavaScript é adicionado na extremidade do corpo e o CSS é adicionado ao cabeçalho da página.

  • Cabeçalho da página JavaScript de bibliotecas do cliente - Isso define as categorias da biblioteca do cliente JavaScript a serem carregadas no cabeçalho da página.

    • As categorias definidas aqui que também estão presentes no campo Bibliotecas do cliente terão o JavaScript carregado no cabeçalho da página em vez de no final do corpo.
    • Nenhum CSS será carregado, a menos que a categoria também esteja presente no campo Bibliotecas do cliente.
  • Biblioteca cliente de recursos da Web - A categoria de bibliotecas de clientes usada para servir recursos da Web, como favicons.

  • Ir para o conteúdo principal - seletor de elemento - Usado como um recurso de acessibilidade para ignorar diretamente o conteúdo principal da página.

  • Renderizar links de idiomas alternativos - Se habilitada, os links para versões de idiomas alternativos da página no mesmo site serão adicionados ao cabeçalho da página.

Caixa de diálogo de design do componente de Página

As bibliotecas podem ser configuradas para os campos Bibliotecas do cliente e Cabeçalho da página JavaScript de bibliotecas do cliente da seguinte maneira:

  • Para adicionar um novo campo, clique ou toque no botão Adicionar abaixo dos campos.
  • Para remover um campo, clique ou toque no ícone da lixeira ao lado do campo a ser removido.
  • Para reorganizar a ordem de carregamento, clique ou toque e arraste a alça ao lado do campo a ser movido.

Para mais informações sobre o uso de bibliotecas do lado do cliente, consulte Uso de bibliotecas do lado do cliente.

CAUTION
A capacidade de definir bibliotecas de clientes separadamente para o cabeçalho da página foi introduzida com os Componentes principais versão 2.2.0.

Guia Estilos styles-tab

O componente de Página é compatível com o Sistema de Estilos do AEM.

Camada de dados de clientes Adobe data-layer

O componente de Página oferece suporte à Camada de dados de clientes Adobe.

recommendation-more-help
d2be9096-a81e-404b-9952-d8925af7219c