Criar modelos de fragmentos de conteúdo create-content-fragment-models
Este capítulo aborda as etapas para criar cinco modelos de fragmento de conteúdo:
- Informações de contato
- Endereço
- Pessoa
- Local
- Equipe
Os modelos de fragmento de conteúdo permitem definir relações entre tipos de conteúdo e manter essas relações como esquemas. Use referências de fragmento aninhadas, vários tipos de dados de conteúdo e o tipo de guia para organização visual do conteúdo. Tipos de dados mais avançados, como espaços reservados para guias, referências de fragmentos, objetos JSON e o tipo de dados data e hora.
Este capítulo também aborda como aprimorar as regras de validação para referências de conteúdo, como imagens.
Pré-requisitos prerequisites
Este é um tutorial avançado. Antes de continuar com este capítulo, verifique se você concluiu o configuração rápida. Certifique-se de ler também o anterior visão geral capítulo para obter mais informações sobre a configuração do tutorial avançado.
Objetivos objectives
- Criar modelos de fragmento de conteúdo.
- Adicione espaços reservados em guias, data e hora, objetos JSON, referências de fragmento e referências de conteúdo aos modelos.
- Adicione validação às referências de conteúdo.
Visão geral do modelo de fragmento de conteúdo content-fragment-model-overview
O vídeo a seguir fornece uma breve introdução aos modelos de fragmento de conteúdo e como eles são usados neste tutorial.
Criar modelos de fragmentos de conteúdo create-models
Vamos criar alguns modelos de fragmento de conteúdo para o aplicativo WKND. Se você precisar de uma introdução básica à criação de modelos de fragmento de conteúdo, consulte o capítulo apropriado no tutorial básico.
-
Navegue até Ferramentas > Geral > Modelos de fragmentos do conteúdo.
-
Selecionar WKND compartilhado para visualizar a lista de modelos de fragmento de conteúdo existentes para o site.
Modelo de informações de contato contact-info-model
Em seguida, crie um modelo que contenha as informações de contato de uma pessoa ou local.
-
Selecionar Criar no canto superior direito.
-
Forneça ao modelo um título de "Informações de contato" e selecione Criar. No modal de sucesso exibido, selecione Abertura para editar o modelo recém-criado.
-
Comece arrastando um Texto em linha única no modelo. Dê a ele um Rótulo do campo de "Telefone" na Propriedades guia. O nome da propriedade é preenchido automaticamente como
phone
. Marque a caixa de seleção para criar o campo Obrigatório. -
Navegue até a Tipos de dados e adicionar outro Texto em linha única abaixo do campo "Telefone". Dê a ele um Rótulo do campo de "Email" e também o defina como Obrigatório.
O Adobe Experience Manager vem com alguns métodos de validação integrados. Esses métodos de validação permitem adicionar regras de governança a campos específicos nos modelos de fragmento de conteúdo. Nesse caso, vamos adicionar uma regra de validação para garantir que os usuários só possam inserir endereços de email válidos ao preencher esse campo. No Tipo de validação selecione E-mail.
O modelo completo de fragmento de conteúdo deve ser semelhante a:
Depois de concluído, selecione Salvar para confirmar as alterações e fechar o Editor de modelos de fragmentos de conteúdo.
Modelo de endereço address-model
Em seguida, crie um modelo para um endereço.
-
No WKND compartilhado, selecione Criar no canto superior direito.
-
Insira um título de "Endereço" e selecione Criar. No modal de sucesso exibido, selecione Abertura para editar o modelo recém-criado.
-
Arraste e solte uma Texto em linha única no modelo e forneça a ele um Rótulo do campo de "Endereço". O nome da propriedade é preenchido como
streetAddress
. Selecione o Obrigatório caixa de seleção -
Repita as etapas acima e adicione mais quatro campos de "Texto de linha única" ao modelo. Use os seguintes rótulos:
- Cidade
- Estado
- Código postal
- País
-
Selecionar Salvar para salvar as alterações no modelo de Endereço.
O modelo de fragmento "Endereço" concluído deve ter esta aparência:
Modelo de pessoa person-model
Em seguida, crie um modelo que contenha informações sobre uma pessoa.
-
No canto superior direito, selecione Criar.
-
Dê ao modelo um título de "Pessoa" e selecione Criar. No modal de sucesso exibido, selecione Abertura para editar o modelo recém-criado.
-
Comece arrastando um Texto em linha única no modelo. Dê a ele um Rótulo do campo de "Nome completo". O nome da propriedade é preenchido automaticamente como
fullName
. Marque a caixa de seleção para criar o campo Obrigatório. -
Os modelos de fragmento de conteúdo podem ser consultados em outros modelos. Navegue até a Tipos de dados e arraste e solte a guia Referência do fragmento e forneça um rótulo de "Contact Info".
-
No Propriedades , no menu Modelos de fragmentos do conteúdo permitido , selecione o ícone de pasta e escolha o Informações de contato modelo de fragmento criado anteriormente.
-
Adicionar um Referência de conteúdo e dê a ele um Rótulo do campo de "Foto do perfil". Selecione o ícone de pasta em Caminho raiz para abrir a modal de seleção de caminho. Selecione um caminho raiz selecionando conteúdo > Assets e marcando a caixa de seleção de WKND compartilhado. Use o Selecionar botão na parte superior direita para salvar o caminho. O caminho do texto final deve ser lido
/content/dam/wknd-shared
. -
Em Aceitar apenas tipos de conteúdo especificados, selecione "Imagem".
-
Para limitar o tamanho e as dimensões do arquivo de imagem, vamos ver algumas opções de validação para o campo de referência de conteúdo.
Em Aceitar apenas o tamanho de arquivo especificado, selecione "Menor que ou igual a" e campos adicionais aparecerão abaixo.
-
Para Máx, digite "5" e para Selecionar unidade, selecione "Megabytes (MB)". Essa validação permite que apenas imagens do tamanho especificado sejam escolhidas.
-
Em Aceitar apenas a largura de imagem especificada, selecione "Largura máxima". No Máximo (pixels) que for exibido, digite "10000". Selecione as mesmas opções para Aceitar apenas uma altura de imagem especificada.
Essas validações garantem que as imagens adicionadas não excedam os valores especificados. Agora, as regras de validação se parecem com o seguinte:
-
Adicionar um Texto multilinha e dê a ele um Rótulo do campo de "Biografia". Deixe a Tipo padrão como a opção padrão "Rich Text".
-
Navegue até a Tipos de dados e arraste uma Enumeração campo abaixo de "Biografia". Em vez do padrão Renderizar como selecione Lista suspensa e dê a ele um Rótulo do campo do "Nível de experiência do professor". Informe uma seleção de opções de nível de experiência do professor, como Especialista, avançado, intermediário.
-
Em seguida, arraste outro Enumeração campo em "Nível de experiência do professor" e escolha "caixas de seleção" no campo Renderizar como opção. Dê a ele um Rótulo do campo de "Competências". Entre em diferentes habilidades, como escalada, surf, ciclismo, esqui e mochila. O rótulo da opção e o valor da opção devem corresponder conforme abaixo:
-
Por último, crie um rótulo de campo "Detalhes do administrador" usando um Texto multilinha campo.
Selecionar Salvar para confirmar as alterações e fechar o Editor de modelos de fragmentos de conteúdo.
Modelo de localização location-model
O próximo modelo de fragmento de conteúdo descreve um local físico. Esse modelo usa espaços reservados em guias. Os espaços reservados para guias ajudam a organizar os tipos de dados no editor de modelo e o conteúdo no editor de fragmento, respectivamente, categorizando o conteúdo. Cada espaço reservado cria uma guia, semelhante a uma guia em um navegador da Internet, no editor de Fragmento de conteúdo. O modelo de Localização deve ter duas guias: Detalhes da localização e Endereço da localização.
-
Como anteriormente, selecione Criar para criar outro modelo de fragmento de conteúdo. Para o Título do modelo, digite "Local". Selecionar Criar seguido por Abertura no modal de sucesso exibido.
-
Adicionar um Espaço reservado da guia ao modelo e rotule-o como "Detalhes de localização".
-
Arraste e solte uma Texto em linha única e rotule-o como "Nome". Abaixo deste rótulo de campo, adicione um texto multilinha e rotule-o como "Descrição".
-
Em seguida, adicione um Referência do fragmento e rotule-o como "Informações de contato". Na guia Propriedades, em Modelos de fragmentos do conteúdo permitido, selecione o Ícone de pasta e escolha o modelo de fragmento "Informações de contato" criado anteriormente.
-
Adicionar um Referência de conteúdo em "Informações de contato". Rotule-o como "Imagem de localização". A variável Caminho raiz deve ser
/content/dam/wknd-shared.
Em Aceitar apenas tipos de conteúdo especificados, selecione "Imagem". -
Vamos também adicionar um Objeto JSON sob a "Imagem do local". Como esse tipo de dados é flexível, ele pode ser usado para exibir quaisquer dados que você deseja incluir no conteúdo. Nesse caso, o objeto JSON é usado para exibir informações sobre o tempo. Rotule o objeto JSON "Clima por temporada". No Propriedades , adicionar um Descrição portanto, fica claro para o usuário quais dados devem ser inseridos aqui: "Dados JSON sobre o clima no local do evento por estação (primavera, verão, outono, inverno)".
-
Para criar a guia Endereço do local, adicione um Espaço reservado da guia ao modelo e rotule-o como "Endereço do local".
-
Arraste e solte uma Referência do fragmento e na guia de propriedades, rotule-o como "Endereço" e, em Modelos de fragmentos do conteúdo permitido, selecione o Endereço modelo.
-
Selecionar Salvar para confirmar as alterações e fechar o Editor de modelos de fragmentos de conteúdo. O modelo de Localização concluído deve aparecer conforme abaixo:
Modelo da equipe team-model
Finalmente, crie um modelo que descreva uma equipe de pessoas.
-
No WKND compartilhado selecione Criar para criar outro modelo de fragmento de conteúdo. Para o Título do modelo, digite "Equipe". Como anteriormente, selecione Criar seguido por Abertura no modal de sucesso exibido.
-
Adicionar um Texto multilinha ao formulário. Em Rótulo do campo, digite "Descrição".
-
Adicionar um Data e hora ao modelo e rotule-o como "Data de fundação da equipe". Nesse caso, mantenha o padrão Tipo defina como "Date", mas observe que também é possível usar "Date & Time" ou "Time".
-
Navegue até a Tipos de dados guia. Abaixo da "Data de fundação da equipe", adicione uma Referência do fragmento. No Renderizar como selecione "vários campos". Para Rótulo do campo, digite "Membros da equipe". Este campo está vinculado à Person modelo criado anteriormente. Como o tipo de dados é um multicampo, vários fragmentos de Pessoa podem ser adicionados, permitindo a criação de uma equipe de pessoas.
-
Em Modelos de fragmentos do conteúdo permitido, use o ícone de pasta para abrir a modal Selecionar caminho e selecione a Person modelo. Use o Selecionar botão para salvar o caminho.
-
Selecionar Salvar para confirmar as alterações e fechar o Editor de modelos de fragmentos de conteúdo.
Adicionar referências de fragmento ao modelo de aventura fragment-references
Semelhante à forma como o modelo Equipe tem uma referência de fragmento para o modelo Pessoa, os modelos Equipe e Localização devem ser referenciados a partir do modelo Aventura para exibir esses novos modelos no aplicativo WKND.
-
No WKND compartilhado selecione a Aventura e selecione Editar no início da navegação.
-
Na parte inferior do formulário, abaixo de "O que trazer", adicione uma Referência do fragmento campo. Insira um Rótulo do campo de "Localização". Em Modelos de fragmentos do conteúdo permitido, selecione o Localização modelo.
-
Adicionar mais um Referência do fragmento e rotule-o como "Equipe do professor". Em Modelos de fragmentos do conteúdo permitido, selecione o Equipe modelo.
-
Adicionar outro Referência do fragmento e rotule-o como "Administrador".
-
Selecionar Salvar para confirmar as alterações e fechar o Editor de modelos de fragmentos de conteúdo.
Práticas recomendadas best-practices
Existem algumas práticas recomendadas relacionadas à criação de modelos de fragmento de conteúdo:
-
Criar modelos que mapeiam para componentes UX. Por exemplo, o aplicativo WKND tem modelos de fragmento de conteúdo para aventuras, artigos e localização. Você também pode adicionar cabeçalhos, promoções ou isenções de responsabilidade. Cada um desses exemplos compõe um componente UX específico.
-
Crie o menor número de modelos possível. Limitar o número de modelos permite maximizar a reutilização e simplificar o gerenciamento de conteúdo.
-
Aninhe os modelos de fragmento de conteúdo tão profundamente quanto necessário, mas somente conforme necessário. Lembre-se de que o aninhamento é realizado com referências de fragmento ou de conteúdo. Considere um máximo de cinco níveis de aninhamento.
Parabéns. congratulations
Parabéns! Agora você adicionou guias, usou os tipos de dados de objeto data e hora e JSON e aprendeu mais sobre referências de fragmento e conteúdo. Você também adicionou regras de validação de referência de conteúdo.
Próximas etapas next-steps
O próximo capítulo desta série criação de fragmentos de conteúdo a partir dos modelos criados neste capítulo. Saiba como usar os tipos de dados introduzidos neste capítulo e criar políticas de pasta para limitar quais modelos de fragmento de conteúdo podem ser criados em uma pasta de ativos.
Embora seja opcional para este tutorial, publique todo o conteúdo em situações de produção reais. Para obter uma revisão dos ambientes Autor e Publicação no AEM, consulte o
Série de vídeos AEM Headless e GraphQL.