Modelos de página page-templates

Neste capítulo, exploraremos a relação entre um Modelo de página e uma Página. Criaremos um modelo de artigo de revista sem estilo com base em alguns modelos de AdobeXD. No processo de criação do modelo, os Componentes principais e as configurações de política avançadas são abordados.

Pré-requisitos prerequisites

Este é um tutorial em várias partes e presume-se que as etapas descritas no Criar conteúdo e publicar alterações capítulo foram concluídas.

Objetivo

  1. Entenda os detalhes dos Modelos de página e como as políticas podem ser usadas para impor o controle granular do conteúdo da página.
  2. Saiba como Modelos e Páginas são vinculados.
  3. Crie um novo modelo e crie uma página.

O que você vai criar what-you-will-build

Nesta parte do tutorial, você criará um novo modelo de Página de artigo de revista que pode ser usado para criar novos artigos de revista e se alinha a uma estrutura comum. O modelo é baseado em designs e em um kit de interface do usuário produzido no AdobeXD. Este capítulo foca apenas na criação da estrutura ou esqueleto do template. Nenhum estilo é implementado, mas o modelo e as páginas são funcionais.

Criar o modelo da página de artigo da revista

Ao criar uma página, você deve selecionar um modelo, que é usado como base para a criação da nova página. O modelo define a estrutura da página resultante, o conteúdo inicial e os componentes permitidos.

Existem 3 áreas principais de Modelos de página:

  1. Estrutura - define os componentes que fazem parte do modelo. Eles não podem ser editados por autores de conteúdo.
  2. Conteúdo inicial - define os componentes com os quais o modelo começa; eles podem ser editados e/ou excluídos por autores de conteúdo
  3. Políticas - define as configurações sobre como os componentes se comportam e quais opções os autores terão disponíveis.

Em seguida, crie um novo modelo no AEM que corresponda à estrutura dos modelos. Isso ocorrerá em uma instância local de AEM. Siga as etapas do vídeo abaixo:

Você pode usar a seguinte miniatura para identificar seu modelo (ou fazer upload do seu próprio modelo!)

Miniatura do modelo de página de artigo

Pacote de soluções

Um concluído solução do modelo de revista O pode ser baixado e instalado pelo Gerenciador de pacotes.

Atualizar o cabeçalho e o rodapé com fragmentos de experiência experience-fragments

Uma prática comum ao criar conteúdo global, como um cabeçalho ou rodapé, é usar um Fragmento de experiência. Fragmentos de experiência, permitem que os usuários combinem vários componentes para criar um único componente que pode ser referenciado. Os Fragmentos de experiência têm a vantagem de oferecer suporte ao gerenciamento de vários sites e localização.

O modelo de site gerou um Cabeçalho e Rodapé. Em seguida, atualize os Fragmentos de experiência para corresponder aos modelos. Siga as etapas do vídeo abaixo:

Etapas de alto nível para o vídeo abaixo:

  1. Baixe o pacote de conteúdo de amostra WKND-Starter-Assets-Skate-Article-1.2.zip.
  2. Faça upload e instale o pacote de conteúdo usando o Gerenciador de pacotes.
  3. Atualizar os Fragmentos de experiência de cabeçalho e rodapé para usar o logotipo da WKND

Criar uma página de artigo da revista

Em seguida, crie uma nova página usando o modelo Página de artigo da revista. Crie o conteúdo da página para corresponder aos modelos de site. Siga as etapas do vídeo abaixo:

Use o texto fornecido para preencher o corpo do artigo.

Parabéns. congratulations

Parabéns, você acabou de criar um novo modelo e página com o Adobe Experience Manager Sites.

Próximas etapas next-steps

Nesse momento, a página de artigo da revista e o site não correspondem aos estilos de marca da WKND. Siga as Theming tutorial para saber mais sobre as práticas recomendadas para atualizar o código de front-end CSS e Javascript usado para aplicar estilos globais ao site.

Pacote de soluções

Um pacote de solução para este capítulo está disponível para download: WKND-Magazine-Template-SOLUTION-1.0.zip.

recommendation-more-help
b2a561c1-47c0-4182-b8c1-757a197484f9