Modèles de page - Statiques page-templates-static
Un modèle sert à créer une page. Il définit les composants pouvant être utilisés dans l’étendue sélectionnée. Un modèle est une hiérarchie de nœuds ayant la même structure que la page à créer, mais sans contenu réel.
Chaque modèle vous présente une sélection de composants disponibles pour utilisation.
- Les modèles sont constitués de composants ;
- les composants utilisent et permettent d’accéder aux widgets et ceux-ci sont utilisés pour rendre le contenu.
Propriétés et nœuds enfants d’un modèle properties-and-child-nodes-of-a-template
Un modèle est un nœud de type cq:Template et possède les propriétés suivantes ainsi que des nœuds enfants :
Un modèle sert de fondement pour une page.
Pour créer une page, le modèle doit être copié (node-tree /apps/<myapp>/template/<mytemplate>) vers la position correspondante dans l’arborescence : c’est ce qui se passe si une page est créée en utilisant l’onglet Sites web.
Cette action de copie confère également à la page son contenu initial (généralement le contenu de niveau supérieur uniquement) et la propriété sling:resourceType, le chemin d’accès au composant de page utilisé pour effectuer le rendu de la page (tout ce qui est présent dans le nœud enfant jcr:content).
Structure des modèles how-templates-are-structured
Il y a deux aspects à prendre en compte :
- la structure du modèle lui-même ;
- la structure du contenu produit lorsqu’un modèle est utilisé.
Structure d’un modèle the-structure-of-a-template
Un modèle est créé sous un nœud de type cq:Template.
Différentes propriétés peuvent être définies, notamment :
- jcr:title - Titre du modèle ; s’affiche dans la boîte de dialogue lors de la création d’une page.
- jcr:description - Description du modèle. Elle s’affiche dans la boîte de dialogue lors de la création d’une page.
Ce nœud contient un nœud jcr:content (cq:PageContent) qui sert de base au nœud de contenu des pages créées. Il fait référence, à l’aide de sling:resourceType, au composant à utiliser pour le rendu du contenu réel d’une nouvelle page.
Ce composant est utilisé pour définir la structure et la conception du contenu lors de la création d’une page.
Contenu produit par un modèle the-content-produced-by-a-template
Les modèles servent à créer des pages de type cq:Page (comme mentionné précédemment, une page est un type spécial de composant). Chaque page AEM possède un nœud structuré jcr:content. Celui-ci :
- est de type cq:PageContent
- est un type de nœud structuré contenant une définition de contenu définie ;
- possède une propriété
sling:resourceTypepour référencer le composant contenant les scripts sling utilisés pour le rendu du contenu.
Modèles par défaut default-templates
AEM offre un certain nombre de modèles par défaut prêts à l’emploi. Dans certaines situations, vous pouvez utiliser les modèles tels quels. Dans ce cas, vous devez vous assurer que le modèle est disponible pour votre site web.
Par exemple, AEM est fourni avec plusieurs modèles, notamment une page de contenu et une page d’accueil.
Afficher les modèles par défaut displaying-default-templates
Pour voir une liste de tous les modèles du référentiel, procédez comme suit :
-
Dans CRXDE Lite, ouvrez le menu Outils et cliquez sur Requête.
-
Dans l’onglet Requête
-
Comme Type, sélectionnez XPath.
-
Dans la zone de saisie Requête, entrez la chaîne suivante :
//element(*, cq:Template) -
Cliquez sur Exécuter. La liste s’affiche dans la zone de résultat.
Dans la plupart des cas, c’est à partir d’un modèle existant que vous élaborez un nouveau modèle pour votre usage personnel. Pour plus d’informations, voir Développer des modèles de page.
Pour activer un modèle existant pour votre site web et l’afficher dans la boîte de dialogue Créer une page lors de la création d’une page directement sous Sites web à partir de la console Sites web, définissez la propriété allowedPaths du nœud de modèle sur : /content(/.*)?
Application de conceptions de modèle how-template-designs-are-applied
Lorsque des styles sont définis dans l’interface utilisateur à l’aide du mode Conception, la conception est conservée à l’emplacement exact du nœud de contenu pour lequel le style est défini.
Si les conceptions ne sont appliquées qu’en mode de conception, les sections suivantes, la Résolution du chemin de conception, l’Arborescence de décision et l’Exemple ne sont pas applicables.
Résolution du chemin de conception design-path-resolution
Lors du rendu du contenu à partir d’un modèle statique, AEM tentera d’appliquer la conception et les styles les plus pertinents pour le contenu, sur la base de la traversée de la hiérarchie du contenu.
AEM détermine le style le plus pertinent pour un nœud de contenu dans l’ordre suivant :
- S’il existe une conception pour le chemin d’accès complet et exact du nœud de contenu (comme lorsque la conception est définie en mode de conception), utilisez cette conception.
- S’il existe une conception pour le nœud de contenu du parent, utilisez-la.
- S’il existe une conception pour n’importe quel nœud sur le chemin du nœud de contenu, utilisez-la.
Dans les deux derniers cas, s’il existe plusieurs conceptions applicables, utilisez celle la plus proche du nœud de contenu.
Arborescence de décision decision-tree
Il s’agit d’une représentation graphique de la logique de Résolution du chemin de conception.
Exemple example
Penchez-vous sur une simple structure de contenu comme celle qui suit, où une conception peut s’appliquer à l’un des nœuds :
/root/branch/leaf
Le tableau suivant décrit comment AEM choisit une conception.
Développer des modèles de page developing-page-templates
Les modèles de pages AEM sont simplement des modèles utilisés pour créer des pages. Ils peuvent contenir autant ou moins de contenu initial que nécessaire. Leur rôle est de créer les structures de nœud initiales appropriées, avec les propriétés requises (principalement sling:resourceType) définies pour permettre la modification et le rendu.
Créer un modèle (basé sur un modèle existant) creating-a-new-template-based-on-an-existing-template
Un nouveau modèle peut être entièrement créé de toutes pièces, mais en pratique, un modèle existant est copié et mis à jour pour vous permettre de gagner du temps. Par exemple, les modèles de Geometrixx peuvent être utilisés pour vous aider à démarrer.
Pour créer un modèle basé sur un modèle existant :
-
Copiez un modèle existant (de préférence avec une définition aussi proche que possible de ce que vous souhaitez réaliser) vers un nouveau nœud.
Les modèles sont généralement stockés dans /apps/<website-name>/templates/<template-name>.
note NOTE La liste des modèles disponibles dépend de l’emplacement de la nouvelle page et des restrictions de positionnement spécifiées dans chaque modèle. Voir Disponibilité du modèle. -
Modifiez le jcr:title du nouveau nœud de modèle pour refléter son nouveau rôle. Vous pouvez également mettre à jour le jcr:description si nécessaire. Assurez-vous de modifier la disponibilité du modèle de la page, le cas échéant.
note NOTE Pour afficher le modèle dans la boîte de dialogue Créer une page lors de la création d’une page directement sous Sites web à partir de la console Sites web, définissez la propriété allowedPathsdu nœud de modèle sur :/content(/.*)?.
-
Copiez le composant sur lequel le modèle est basé (cela est indiqué par la propriété sling:resourceType du nœud jcr:content dans le modèle) pour créer une instance .
Les composants sont stockés dans /apps/<website-name>/components/<component-name>.
-
Mettez à jour les jcr:title et jcr:description du nouveau composant.
-
Remplacez le fichier thumbnail.png si vous souhaitez qu’une nouvelle image miniature soit affichée dans la liste de sélection du modèle (taille 128x98 px).
-
Mettez à jour le sling:resourceType du nœud jcr:content du modèle pour référencer le nouveau composant.
-
Apportez des modifications supplémentaires à la fonctionnalité ou à la conception du modèle, ou à son composant sous-jacent, ou aux deux.
note NOTE Les modifications apportées au nœud /apps/<website>/templates/<template-name> affectent l’instance de modèle (comme dans la liste de sélection). Les modifications apportées au nœud /apps/<website>/components/<component-name> affectent la page de contenu créée lorsque le modèle est utilisé. Vous pouvez désormais créer une page sur votre site web à l’aide du nouveau modèle.
cq.shared existe dans les pages de contenu. Si cet élément est absent, l’erreur JavaScript Uncaught TypeError: Cannot read property 'shared' of undefined est renvoyée.cq.shared est inclus dans tous les exemples de pages de contenu. Par conséquent, tout contenu basé sur ces pages inclut automatiquement cq.shared. Toutefois, si vous décidez de créer vos propres pages de contenu à partir de zéro, sans vous servir de l’exemple de contenu, vous devez veiller à inclure l’espace de noms cq.shared.Rendre un modèle existant disponible making-an-existing-template-available
Cet exemple illustre comment autoriser l’utilisation d’un modèle pour certains chemins de contenu. Les modèles disponibles pour la personne créant la page lors de la création de pages sont déterminés par la logique définie dans Disponibilité du modèle.
-
Dans CRXDE Lite, accédez au modèle que vous souhaitez utiliser pour votre page, par exemple, le modèle Newsletter.
-
Modifiez la propriété
allowedPathset les autres propriétés utilisées pour la disponibilité du modèle. Par exemple,allowedPaths:/content/geometrixx-outdoors/[^/]+(/.*)?signifie que ce modèle est autorisé dans tous les chemins sous/content/geometrixx-outdoors.