Modelos de página - Estáticos

Um Modelo é usado para criar uma Página e define quais componentes podem ser usados dentro do escopo selecionado. Um modelo é uma hierarquia de nós que tem a mesma estrutura que a página a ser criada, mas sem nenhum conteúdo real.

Cada modelo apresentará uma seleção de componentes disponíveis para uso.

• Os modelos são construídos de Components;
• Os componentes usam e permitem acesso a Widgets, e esses são usados para renderizar o Conteúdo.

Propriedades e nós secundários de um modelo

Um modelo é um nó do tipo cq:Template e tem as seguintes propriedades e nós secundários:

Um modelo é a base de uma página.

Para criar uma página, o modelo deve ser copiado (node-tree /apps/<myapp>/template/<mytemplate>) para a posição correspondente na árvore do site: isso é o que acontece se uma página for criada usando a guia Sites.

Essa ação de cópia também fornece à página seu conteúdo inicial (normalmente, somente conteúdo de nível superior) e a propriedade sling:resourceType, o caminho para o componente de página que é usado para renderizar a página (tudo no nó filho jcr:content).

Como os Modelos são estruturados

Há dois aspectos a considerar:

• a estrutura do próprio modelo
• a estrutura do conteúdo produzido quando um modelo é usado

A estrutura de um Modelo

Um Modelo é criado em um nó do tipo cq:Template.

Podem ser definidas várias propriedades, em especial:

• jcr:title - title para o modelo; aparece na caixa de diálogo ao criar uma página.
• jcr:description - descrição do modelo; aparece na caixa de diálogo ao criar uma página.

Este nó contém um nó jcr:content (cq:PageContent) que pode ser usado como a base para o nó de conteúdo das páginas resultantes; isso faz referência, usando sling:resourceType, ao componente a ser usado para renderizar o conteúdo real de uma nova página.

Esse componente é usado para definir a estrutura e o design do conteúdo quando uma nova página é criada.

O conteúdo produzido por um Modelo

Os modelos são usados para criar páginas do tipo cq:Page (como mencionado anteriormente, uma página é um tipo especial de componente). Cada Página AEM tem um nó estruturado jcr:content. Isso:

• é do tipo cq:PageContent
• é um tipo de nó estruturado que contém uma definição de conteúdo definida
• tem uma propriedade sling:resourceType para fazer referência ao componente que contém os scripts sling usados para renderizar o conteúdo

Modelos padrão

AEM vem com vários modelos padrão disponíveis prontamente. Em alguns casos, talvez você queira usar os modelos como estão. Nesse caso, é necessário garantir que o modelo esteja disponível para seu site.

Por exemplo, AEM vem com vários modelos, incluindo uma página de conteúdo e um home page.

Exibindo Modelos Padrão

Para ver uma lista de todos os modelos no repositório, proceda da seguinte maneira:

1. No CRXDE Lite, abra o menu Ferramentas e clique em Query.

2. Na guia Query

3. Como Type, selecione XPath.

4. No campo de entrada Query, digite a seguinte string:

   //element(*, cq:Template)

5. Clique em Executar. A lista é exibida na caixa de resultados.

Na maioria dos casos, você pegará um modelo existente e desenvolverá um novo para seu próprio uso. Consulte Desenvolvimento de modelos de página para obter mais informações.

Para habilitar um modelo existente para seu site e desejar que ele seja exibido na caixa de diálogo Criar página ao criar uma página sob Sites a partir do console Sites, defina a propriedade allowPaths do nó modelo como: /content(/.*?lang=pt-BR)?

Como os modelos são aplicados

Quando os estilos são definidos na interface usando Modo de design, o design é mantido no caminho exato do nó de conteúdo para o qual o estilo está sendo definido.

Se os designs só forem aplicados usando o Modo de design, as seguintes seções, Resolução do caminho de design, Árvore de decisão e Exemplo não serão aplicáveis.

Resolução do caminho de design

Ao renderizar conteúdo com base em um modelo estático, AEM tentará aplicar o design e os estilos mais relevantes ao conteúdo com base em uma transversal da hierarquia de conteúdo.

AEM determina o estilo mais relevante para um nó de conteúdo na seguinte ordem:

• Se houver um design para o caminho completo e exato do nó de conteúdo (como quando o design é definido no Modo de design), use esse design.
• Se houver um design para o nó de conteúdo do pai, use esse design.
• Se houver um design para qualquer nó no caminho do nó de conteúdo, use esse design.

Nos dois últimos casos, se houver mais de um design aplicável, use o mais próximo do nó de conteúdo.

Árvore de decisão

Esta é uma representação gráfica da lógica Resolução do Caminho de Design.

Exemplo

Considere uma estrutura de conteúdo simples da seguinte maneira, na qual um design pode se aplicar a qualquer um dos nós:

/root/branch/leaf

A tabela a seguir descreve como AEM escolherá um design.

Desenvolvendo modelos de página

AEM modelos de página são simplesmente modelos usados para criar novas páginas. Eles podem conter o mínimo ou tanto conteúdo inicial quanto necessário, sendo sua função criar as estruturas de nó iniciais corretas, com as propriedades necessárias (principalmente sling:resourceType) definidas para permitir a edição e a renderização.

Criando um novo modelo (com base em um modelo existente)

É necessário dizer que um novo modelo pode ser criado completamente do zero, mas geralmente um modelo existente será copiado e atualizado para economizar tempo e esforço. Por exemplo, os modelos dentro do Geometrixx podem ser usados para ajudá-lo a começar.

Para criar um novo modelo com base em um modelo existente:

1. Copie um modelo existente (de preferência, com uma definição o mais próxima possível do que você deseja obter) para um novo nó.

   Normalmente, os modelos são armazenados em /apps/<nome-do-site>/models/<nome-do-modelo>.

   OBSERVAÇÃO

   A lista dos modelos disponíveis depende do local da nova página e das restrições de posicionamento especificadas em cada modelo. Consulte Disponibilidade do modelo.

2. Altere jcr:title do novo nó de modelo para refletir sua nova função. Você também pode atualizar o jcr:description, se apropriado. Certifique-se de alterar a disponibilidade do modelo da página, conforme apropriado.

   OBSERVAÇÃO

   Se quiser que seu modelo seja exibido na caixa de diálogo Criar página ao criar uma página sob Sites a partir do console Sites, defina a propriedade allowedPaths do nó de modelo como: /content(/.*?lang=pt-BR)?

   

3. Copie o componente no qual o modelo se baseia (isso é indicado pela propriedade sling:resourceType do nó jcr:content no modelo) para criar uma nova instância.

   Geralmente, os componentes são armazenados em /apps/<nome-do-site>/components/<nome-do-componente>.

4. Atualize jcr:title e jcr:description do novo componente.

5. Substitua thumbnail.png se quiser que uma nova imagem em miniatura seja mostrada na lista de seleção do modelo (tamanho 128 x 98 px).

6. Atualize o nó sling:resourceType do modelo jcr:content para fazer referência ao novo componente.

7. Faça outras alterações na funcionalidade ou design do modelo e/ou seu componente subjacente.

   OBSERVAÇÃO

   As alterações feitas no nó /apps/<site>/models/<nome-modelo> afetarão a instância do modelo (como na lista de seleção).
   As alterações feitas no nó /apps/<site>/components/<nome-do-componente> afetarão a página de conteúdo criada quando o modelo for usado.

   Agora você pode criar uma página em seu site usando o novo modelo.

Disponibilizando um Modelo Existente

Este exemplo ilustra como permitir que um modelo seja usado para determinados caminhos de conteúdo. Os modelos que estão disponíveis para o autor da página ao criar novas páginas são determinados pela lógica definida em Disponibilidade do modelo.

1. No CRXDE Lite, navegue até o modelo que deseja usar para a sua página, por exemplo, o modelo de boletim.

2. Altere a propriedade allowedPaths e outras propriedades usadas para disponibilidade do modelo. Por exemplo, allowedPaths: /content/geometrixx-outdoors/[^/]+(/.*?lang=pt-BR)? significa que este modelo é permitido em qualquer caminho em /content/geometrixx-outdoors.