DocumentationCommerceContenu et conception

Hiérarchie des pages

Last update: Sun Jul 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Rubriques :
  • CMS

Créé pour :

  • Débutant
  • Intermédiaire
  • Administration
  • Utilisateur ou utilisatrice
Fonctionnalité Adobe Commerce {width="20"} Fonctionnalité exclusive uniquement dans Adobe Commerce (En savoir plus)

Le système de hiérarchie des pages de magasin vous permet d’organiser vos pages de contenu et d’ajouter de la pagination, de la navigation et des menus. La page Politique de confidentialité des exemples de données est un exemple de page avec un menu à gauche. Si vous publiez régulièrement une grande quantité de contenu, vous pouvez utiliser une hiérarchie de pages pour organiser votre contenu afin de faciliter la recherche d’articles intéressants pour les visiteurs.

Le système de hiérarchie des pages utilise des noeuds pour identifier les éléments de contenu associés et pour organiser les pages de contenu en relations parents/enfants. Un noeud parent est comme un dossier pouvant contenir des noeuds enfants et des pages. La position relative de chaque noeud et page dans la hiérarchie est affichée sous la forme d’une structure tree. Un noeud peut contenir d’autres noeuds et pages de contenu, et une seule page de contenu peut être associée à plusieurs noeuds et à d’autres pages de contenu dans une relation parent/enfant ou voisine.

Page avec navigation à gauche

Configurer la hiérarchie des pages

Les paramètres de configuration activent le système de hiérarchie de pages et les métadonnées, et déterminent la mise en page du menu par défaut.

Hiérarchie de page CMS

  1. Sur la barre latérale Admin, accédez à Stores > Settings>Configuration.

  2. Dans le panneau de gauche sous General, choisissez Content Management.

  3. Développez Sélecteur d’extension CMS Page Hierarchy et apportez les modifications nécessaires.

  4. Une fois l’opération terminée, cliquez sur Save Config.

Champ
Description
Enable Hierarchy Functionality
Active l’utilisation de la hiérarchie de pages pour vos pages de contenu. Options : Yes / No
Enable Hierarchy Metadata
Lorsque cette option est activée, vous pouvez associer des métadonnées à des pages de la hiérarchie. Options : Yes / No
Default Layout for Hierarchy Menu
Détermine le style de menu par défaut. Options : Content / Left Column / Right Column

Ajouter un noeud de hiérarchie

L’exemple suivant montre comment créer un noeud avec une navigation simple vers les pages de contenu associées. Bien qu’un noeud ne soit associé à aucune page de contenu, il dispose d’une clé d’URL qui peut être référencée ailleurs dans votre site.

Par exemple, vous pouvez créer un noeud appelé Communiqué de presse qui permet de naviguer jusqu’à des communiqués de presse individuels. Vous pouvez ensuite inclure le lien de votre page À propos de nous au noeud . Vous pouvez également créer un noeud pour un ensemble de problèmes antérieurs de votre newsletter.

Pour créer un lien vers un noeud, utilisez l’outil Widget pour créer un lien Noeud de hiérarchie CMS et placer le widget dans un bloc de contenu ou une page.

Exemple de menu de navigation sur la page À propos de nous

Étape 1 : création d’un noeud

  1. Sur la barre latérale Admin, accédez à Content > Elements>Hierarchy.

    Grille des pages CMS {width="600" modal="regular"}

  2. Au-dessus de la grille, cliquez sur Add Node….

  3. Sous Page Properties, saisissez un Title ​pour le noeud et un URL Key ​approprié.

    La clé URL fournit une adresse web unique pour le noeud. Il doit s’agir de caractères en minuscules, précédés de caractères pour séparer les mots et non d’espaces.

    Propriétés de page {width="500" modal="regular"}

  4. Cliquez sur Save.

    Le noeud apparaît sous la forme d’un dossier dans l’arborescence à gauche de la page.

Étape 2 : Ajouter des pages au noeud

  1. Dans l'arborescence, cliquez sur pour sélectionner le noeud.

  2. Cliquez sur Add Selected Pages(s) to Tree.

    Vous pouvez faire défiler la page vers le haut pour voir que chaque page sélectionnée s’affiche dans l’arborescence sous le dossier de noeud.

Etape 3 : définir la structure

  1. Si nécessaire, faites glisser les pages pour qu’elles reflètent l’ordre dans lequel elles doivent apparaître dans le menu.

    Faire glisser des pages en position {width="500" modal="regular"}

  2. Cliquez sur le noeud en haut de la hiérarchie.

    La section Page Properties ​affiche désormais des informations sur le noeud.

  3. Sous Render Metadata in HTML Head, procédez comme suit :

    Rendre les paramètres de métadonnées {width="400" modal="regular"}

    • Pour identifier le noeud en haut de la hiérarchie, définissez First sur Yes.

    • Pour afficher un contrôle de pagination, définissez Next/Previous sur Yes.

    • Pour organiser les pages de la hiérarchie sous forme de livre, définissez Enable Chapter/Section sur Yes.

      Si vous ne souhaitez pas inclure le noeud dans le livre, laissez la valeur par défaut No.

    • Pour attribuer le noeud à une partie spécifique du livre, définissez Chapter/Section sur l’une des options suivantes :

      • No - Ne définit pas le noeud en tant que chapitre/section.
      • Chapter - Attribue le noeud actif comme chapitre.
      • Section - Attribue le noeud actif sous la forme d’une section.
      • Both - Attribue le noeud actif comme chapitre et section.

Étape 4 : Ajouter des contrôles de pagination

  1. Sous Options de pagination pour les pages imbriquées, définissez Enable Pagination sur Yes.

  2. Pour Frame, saisissez le nombre de liens de page à inclure dans la commande de pagination.

    S’il existe d’autres pages dans la hiérarchie qui peuvent être incluses dans la commande de pagination.

  3. Pour Frame Skip, saisissez le nombre de pages que vous souhaitez ignorer (ou revenir) pour le prochain ensemble de liens de pagination.

Etape 5 : choisissez la disposition du menu

Si vous souhaitez que le noeud apparaisse dans le menu, procédez comme suit :

  1. Sous Options du menu de navigation de page, définissez Show in navigation menu sur Yes.

    Ce paramètre détermine si un menu de navigation est généré pour la hiérarchie des pages.

    Options de menu de navigation de page {width="300" modal="regular"}

  2. Pour spécifier l’emplacement du menu par rapport au contenu, définissez le Menu Layout :

    • Content - La disposition du menu se trouve dans le contenu.
    • Use Default - Utilise le style de menu spécifié dans la configuration.
    • Left Column - Le menu s’affiche à gauche du contenu.
    • Right Column - Le menu s’affiche à droite du contenu.

  3. Pour spécifier la quantité de détails inclus dans le menu, définissez Menu Detalization sur l’une des options suivantes :

    • Only Children - Inclut uniquement les sous-pages dans le menu.
    • Neighbours and Children - Inclut des sous-pages et d’autres pages qui se trouvent au même niveau dans la hiérarchie.

  4. Pour déterminer la profondeur du menu, saisissez le Maximal Depth correspondant au nombre maximal de niveaux à inclure.

  5. Pour mettre en forme le menu, choisissez un List Type :

    • Unordered - Les options de menu ne sont pas numérotées et peuvent être formatées avec ou sans puces. Options pour le type de liste non ordonné : Par défaut / Cercle / Disque / Carré
    • Ordered - Les options du menu sont numérotées et peuvent être formatées sous la forme de chiffres numériques, alphabétiques ou romains, en majuscules ou en minuscules.

  6. Définissez List Style sur l’une des options suivantes :

    • Circle
    • Disc
    • Square

  7. Si vous souhaitez également que le noeud soit visible dans le menu de navigation, faites défiler l’écran jusqu’à Options du menu de navigation principal et définissez Show in Navigation menu sur Yes.

    Options de menu de navigation principal {width="250" modal="regular"}

  8. Cliquez sur Save.

recommendation-more-help
2b0136b4-ef75-405f-9734-60d741f198de