Dans ce chapitre, découvrez comment modéliser du contenu et créer un schéma avec Modèles de fragment de contenu. Vous découvrez les différents types de données qui peuvent être utilisés pour définir un schéma dans le cadre du modèle.
Nous créons deux modèles simples, Équipe et Personne. Le Équipe Le modèle de données a un nom, un nom court et une description, et fait référence au Personne modèle de données, qui porte le nom complet, les détails biographiques, l’image de profil et la liste des professions.
Vous êtes également invité à créer votre propre modèle en suivant les étapes de base et à ajuster les étapes respectives telles que les requêtes GraphQL et le code de l’application React, ou à suivre simplement les étapes décrites dans ces chapitres.
Il s’agit d’un tutoriel en plusieurs parties qui suppose qu’un AEM environnement de création est disponible.
Une configuration de projet contient tous les modèles de fragment de contenu associés à un projet particulier et permet d’organiser les modèles. Au moins un projet doit être créé before création d’un modèle de fragment de contenu.
Connexion à l’AEM Auteur environnement (ex. https://author-pYYYY-eXXXX.adobeaemcloud.com/
)
Dans l’écran AEM Démarrer, accédez à Outils > Général > Explorateur de configuration.
Cliquez sur Créer, dans le coin supérieur droit.
Dans la boîte de dialogue qui s’affiche, saisissez :
Créez ensuite deux modèles pour un Équipe et un Personne.
Création d’un modèle pour un Personne, qui est le modèle de données représentant une personne faisant partie d’une équipe.
Dans l’écran AEM Démarrer, accédez à Outils > Général > Modèles de fragment de contenu.
Accédez au Mon projet dossier.
Appuyer Créer dans le coin supérieur droit pour afficher la Créer un modèle assistant.
Dans Titre du modèle champ, entrer Personne et appuyez sur Créer. Dans la boîte de dialogue qui s’affiche, appuyez sur Ouvrir, pour créer le modèle.
Faites glisser et déposez un Texte sur une seule ligne sur le panneau principal. Renseignez les propriétés suivantes sur le Propriétés tab :
fullName
Le Nom de la propriété définit le nom de la propriété qui est conservée dans AEM. Le Nom de la propriété définit également la variable key nom de cette propriété dans le cadre du schéma de données. Ceci key est utilisé lorsque les données de fragment de contenu sont exposées par le biais des API GraphQL.
Appuyez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Texte multi-lignes sous le champ Nom complet champ . Renseignez les propriétés suivantes :
biographyText
Cliquez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Référence de contenu champ . Renseignez les propriétés suivantes :
profilePicture
/content/dam
Lors de la configuration de la variable Chemin racine, vous pouvez cliquer sur le bouton folder pour afficher un modal afin de sélectionner le chemin. Cela limite les dossiers que les auteurs peuvent utiliser pour renseigner le chemin. /content/dam
est la racine dans laquelle sont stockés tous les AEM Assets (images, vidéos et autres fragments de contenu).
Ajoutez une validation au Référence d’image de sorte que seuls les types de contenu de Images peut être utilisé pour remplir le champ.
Cliquez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Énumération type de données sous le Référence d’image champ . Renseignez les propriétés suivantes :
occupation
Ajouter plusieurs Options en utilisant la variable Ajouter une option bouton . Utiliser la même valeur pour Étiquette d’option et Valeur de l’option:
Artiste, Influenceur, Photographe, Voyageur, Écrivain, YouTuber
La finale Personne modèle doit se présenter comme suit :
Cliquez sur Enregistrer pour enregistrer les modifications.
Création d’un modèle pour un Équipe, qui est le modèle de données d’une équipe de personnes. Le modèle d’équipe référence le modèle Personne pour représenter les membres de l’équipe.
Dans le Mon projet dossier, appuyez sur Créer dans le coin supérieur droit pour afficher le Créer un modèle assistant.
Dans Titre du modèle champ, entrer Équipe et appuyez sur Créer.
Appuyer Ouvrir dans la boîte de dialogue qui s’affiche, pour ouvrir le modèle nouvellement créé.
Faites glisser et déposez un Texte sur une seule ligne sur le panneau principal. Renseignez les propriétés suivantes sur le Propriétés tab :
title
Appuyez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Texte sur une seule ligne sur le panneau principal. Renseignez les propriétés suivantes sur le Propriétés tab :
shortName
^[a-z0-9\-_]{5,40}$
- ainsi, seules les valeurs alphanumériques en minuscules et les tirets de 5 à 40 caractères peuvent être saisis.Le shortName
nous permet d’interroger une équipe en fonction d’un chemin raccourci. Le Unique garantit que la valeur est toujours unique par fragment de contenu de ce modèle.
Appuyez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Texte multi-lignes sous le champ Nom court champ . Renseignez les propriétés suivantes :
description
Cliquez sur le bouton Types de données et effectuez un glisser-déposer d’un élément Référence de fragment champ . Renseignez les propriétés suivantes :
teamMembers
La finale Équipe modèle doit se présenter comme suit :
Cliquez sur Enregistrer pour enregistrer les modifications.
Vous devez maintenant utiliser deux modèles :
Lors de la révision et de la vérification, publiez la variable Project Configuration
& Content Fragment Model
Dans l’écran AEM Démarrer, accédez à Outils > Général > Explorateur de configuration.
Cochez la case en regard de Mon projet et appuyez sur Publier
Dans l’écran AEM Démarrer, accédez à Outils > Général > Modèles de fragment de contenu.
Accédez au Mon projet dossier.
Appuyer Personne et Équipe modèles et appuyez sur Publier
Félicitations, vous venez de créer vos premiers modèles de fragments de contenu !
Dans le chapitre suivant, Création de modèles de fragment de contenu, vous créez et modifiez un fragment de contenu en fonction d’un modèle de fragment de contenu. Vous apprenez également à créer des variantes de fragments de contenu.