Panneau latéral de l’éditeur de page side-panel
Découvrez comment utiliser le panneau latéral dans l’éditeur d’AEM Sites pour ajouter des composants et des ressources à votre page.
Modes du panneau latéral modes
Le panneau latéral est toujours accessible dans l’éditeur de page en appuyant ou en cliquant sur l’icône Activer/désactiver le panneau latéral dans la barre d’outils de l’éditeur de page.
Lorsque vous ouvrez le panneau latéral, il s’ouvre en glissant depuis le côté gauche et vous pouvez ensuite choisir parmi trois onglets importants :
- Explorateur de composants pour ajouter du nouveau contenu à votre page
- L’explorateur de ressources pour ajouter de nouvelles ressources à votre page
- Arborescence de contenu pour parcourir la structure de votre page.
Explorateur de composants components-browser
Les composants sont les blocs de création utilisés pour créer du contenu avec l’éditeur de page d’AEM. Vous placez plusieurs composants sur une page et configurez leurs options pour créer votre page de contenu.
L’explorateur de composants présente tous les composants que vous pouvez utiliser sur la page active. Vous pouvez les faire glisser à l’emplacement approprié, puis les modifier pour ajouter votre contenu.
Appuyez ou cliquez sur l’onglet Composants dans le panneau latéral pour accéder au navigateur Composants.
L’aspect et la gestion de l’interface utilisateur dépendent du type d’appareil utilisé.
Appareil Mobile mobile-device-components-browser
Lors de l’ouverture de l’explorateur de composants sur un appareil mobile, la page en cours de modification est entièrement recouverte.
Pour ajouter un composant à votre page, sélectionnez-le, faites-le glisser et déplacez-le vers la droite. L’explorateur de composants se ferme pour afficher à nouveau la page, où vous pouvez positionner le composant.
Poste de travail desktop-device-components-browser
Lors de l’ouverture de l’explorateur de composants sur un ordinateur de bureau, il s’affiche sur le côté gauche de la fenêtre.
Pour ajouter un composant à votre page, cliquez sur le composant requis et faites-le glisser vers l’emplacement requis.
Utilisation de l’explorateur de composants using-component-browser
Dans le navigateur Composants les composants sont représentés par les éléments suivants :
-
Nom du composant
-
Groupe de composants (en gris)
-
Icône ou abréviation
- Les icônes des composants standard sont monochromes.
- Les abréviations correspondent toujours aux deux premiers caractères du nom du composant.
Dans la barre d’outils supérieure de l’explorateur de composants, vous pouvez effectuer les opérations suivantes :
- Filtrer les composants par nom
- Restreindre l’affichage à un groupe spécifique à l’aide de la liste déroulante.
Pour obtenir une description plus détaillée du composant, vous pouvez sélectionner l’icône d’information en regard du composant dans le navigateur Composants (le cas échéant). Par exemple, pour le fragment de contenu :
Pour plus d’informations sur les composants disponibles, voir Console Composants
Explorateur de ressources assets-browser
Le navigateur Assets affiche toutes les ressources assets qui peuvent être utilisées sur la page active.
Appuyez ou cliquez sur l’onglet Assets dans le panneau latéral pour parcourir les ressources.
Le défilement infini permet de développer la liste des ressources selon les besoins.
L’aspect et la gestion de l’explorateur dépendent du type d’appareil utilisé :
Appareil Mobile mobile-device-assets-browser
Lors de l’ouverture de l’explorateur de ressources sur un appareil mobile, la page en cours de modification est entièrement recouverte.
Pour ajouter une ressource à votre page, sélectionnez-la et faites-la glisser, puis déplacez-la vers la droite. L’explorateur de ressources se ferme pour afficher à nouveau la page, où vous pouvez ajouter la ressource au composant requis.
Poste de travail desktop-device-assets-browser
Lors de l’ouverture de l’explorateur de ressources sur un ordinateur de bureau, il s’ouvre sur le côté gauche de la fenêtre.
Pour ajouter une ressource à votre page, sélectionnez la ressource requise et faites-la glisser vers le composant ou l’emplacement requis.
Utiliser le navigateur Assets using-assets-browser
Pour ajouter une ressource à votre page, sélectionnez-la et faites-la glisser jusqu’à l’emplacement souhaité. Il peut s’agir des éléments suivants :
- d’un composant existant du type approprié.
- Par exemple, vous pouvez faire glisser une ressource de type image sur un composant Image ;
- d’un espace réservé dans le système de paragraphes où créer un composant du type approprié :
- Par exemple, vous pouvez faire glisser une ressource de type image sur le système de paragraphes afin de créer un composant Image.
Dans la barre d’outils supérieure de l’explorateur de ressources, vous pouvez filtrer les ressources en procédant comme suit :
- Nom
- Chemin
- Type de ressource tel que les images, les vidéos, les documents, les paragraphes, les fragments de contenu et les fragments d’expérience
- Caractéristiques des ressources, telles que l’orientation et le style
- Disponible uniquement pour certains types de ressources
Si vous devez modifier rapidement une ressource, vous pouvez lancer l’éditeur de ressources directement depuis l’explorateur de ressources en cliquant sur l’icône Modifier affichée en regard du nom de la ressource.
Arborescence de contenu content-tree
L’Arborescence de contenu donne une vue d’ensemble de tous les composants de la page dans une hiérarchie, afin que vous puissiez voir en un coup d’œil comment la page est composée.
Appuyez ou cliquez sur l’onglet Arborescence de contenu pour accéder à l’arborescence de contenu.
Une fois ouvert, vous pouvez voir une représentation en arborescence de votre page ou modèle. Il est ainsi plus simple de comprendre comment son contenu est structuré de manière hiérarchique. En outre, sur une page complexe, il est plus facile de passer d’un composant à l’autre de la page.
Une page pouvant facilement être composée de nombreux composants du même type, l’arborescence de contenu affiche un texte descriptif (en gris) après le nom du type de composant (en noir). Le texte descriptif provient des propriétés courantes du composant, telles que le titre ou le texte.
Les types de composants sont affichés dans la langue de l’utilisateur ou de l’utilisatrice, tandis que le texte descriptif du composant dépend de la langue de la page.
Cliquez sur le chevron en regard d’un composant pour réduire ou développer ce niveau.
Cliquez sur le composant pour le mettre en surbrillance dans l’éditeur de page. Les actions disponibles dépendent du statut de la page. Par exemple :
Une page de base basic-page
Les composants d’une page de base auront les options habituelles.
Si le composant sur lequel vous cliquez est éditable, une icône de clé à molette s’affiche à droite du nom. Cliquez sur cette icône pour lancer la boîte de dialogue de modification du composant.
Une Live Copy live-copy
Une page qui fait partie d’une Live Copy, où les composants sont hérités d’une autre page, possède différentes options.
Explorateur de contenu associé associated-content-browser
Si votre page contient des fragments de contenu, vous avez également accès au navigateur de contenu associé.