Modifier le contenu d’une page à l’aide de l’éditeur de page AEM edit-content
L’éditeur de page d’AEM est un puissant outil de création du contenu d’une page. Découvrez comment l’utiliser pour faire glisser et déposer du contenu et le modifier sur place.
Vue d’ensemble overview
Vous pouvez effectuer trois actions de base dans l’éditeur de page pour modifier votre contenu :
- Ajout de nouveaux composants en les faisant glisser et en les déposant sur la page.
- Ajout de nouvelles ressources en les faisant glisser et en les déposant sur la page.
- Modification de composants en place qui existent déjà sur la page.
L’éditeur de page d’AEM fournit une interface utilisateur intuitive qui permet d’effectuer ces tâches en plus de donner accès à des fonctionnalités plus avancées.
En outre, l’éditeur vous permet d’organiser le contenu existant sur votre page en vous permettant de :
Ajout de composants adding-components
Vous pouvez faire glisser et déposer de nouveaux composants sur votre page en les sélectionnant dans le navigateur de composants dans le panneau latéral puis en les déposant dans un espace réservé aux composants.
Espace réservé au composant component-placeholder
L’espace réservé du composant est un indicateur qui indique où un composant sera positionné lorsque vous le déposez. Il y a deux apparences.
-
Lors de l’ajout d’un nouveau composant à la page (en le faisant glisser depuis l’explorateur de composants), il s’affiche sous la forme d’une zone grise avec les détails du composant que vous placez.
-
Lorsque vous déplacez un composant existant, il s’affiche sous la forme d’un carré bleu.
Dans les deux cas, la cible sélectionnée s’affiche sous la forme d’un contour bleu sous le composant que vous faites glisser. La cible si l’emplacement du composant sera modifié lorsque vous le relâcherez.
Ajout d’un composant à partir de l’explorateur de composants adding-a-component-from-the-components-browser
Vous pouvez ajouter un nouveau composant à l’aide de l’explorateur de composants. L’espace réservé composant vous indique où vous positionnez le composant.
- Assurez-vous que l’éditeur de page est en mode Modifier.
- Ouvrez l’explorateur de composants.
- Faites glisser le composant requis jusqu’à la position requise puis relâchez-le.
- Modifier le composant nouvellement placé.
Ajout d’un composant à partir du système de paragraphes adding-a-component-from-the-paragraph-system
Vous pouvez ajouter un nouveau composant à l’aide de l’espace réservé Faire glisser des composants ici du système de paragraphes :
-
Assurez-vous que l’éditeur de page est en mode Modifier.
-
Il existe deux façons de sélectionner et d’ajouter un nouveau composant à partir du système de paragraphes :
-
Sélectionnez l’option Insérer le composant (+) depuis la barre d’outils d’un composant existant ou dans la zone Faire glisser les composants ici.
-
Si vous utilisez un ordinateur de bureau, vous pouvez double-cliquer sur la zone Faire glisser les composants ici.
-
-
La boîte de dialogue Insérer un nouveau composant s’ouvre pour vous permettre de sélectionner le composant requis. Appuyez ou cliquez sur le composant que vous souhaitez ajouter.
- Utilisez les filtres de recherche pour trouver votre composant.
- Utilisez l’icône d’information en regard des noms des composants pour en savoir plus sur ceux-ci.
-
Le composant sélectionné est ajouté à la cible que vous avez sélectionnée. Modifiez le composant si nécessaire.
Ajout d’une ressource adding-asset
Vous pouvez également ajouter un nouveau composant à la page en faisant glisser un élément depuis l’explorateur de ressources. Cela crée automatiquement un composant du type approprié contenant la ressource.
Ce comportement peut être configuré pour votre installation. Consultez le document Guide de référence des composants pour plus d’informations.
Pour créer un composant en faisant glisser l’un des types de ressources ci-dessus, suivez ces étapes :
- Assurez-vous que votre page est en mode Modifier.
- Ouvrez l’explorateur de ressources.
- Faites glisser le composant jusqu’à la position requise. L’espace réservé du composant component vous indique où le composant est positionné et une cible indique où il sera inséré.
- Libérez la ressource sur la cible. Un composant, adapté au type de ressource, est créé à l’emplacement requis contenant la ressource sélectionnée.
- Modifiez le composant si nécessaire.
Si, lors de l’exploration des ressources, vous estimez qu’il est nécessaire d’apporter une modification rapide à l’une d’elles, vous pouvez lancer directement l’éditeur de ressources à partir de l’explorateur en cliquant sur l’icône d’édition située en regard de son nom.
Modification De Composants Statiques edit-in-place
La sélection d’un composant ouvre la barre d’outils du composant. Cela permet d’accéder à diverses actions pouvant être réalisées sur le composant.
Les actions disponibles dans la barre d’outils du composant sont appropriées au composant sélectionné. Selon le composant sélectionné, elles s’affichent plus ou moins bien et peuvent être décrites ou non ici.
-
Modifier permet de modifier le contenu du composant, souvent sur place. Son comportement dépend du composant.
-
Configurer permet de modifier certains paramètres du composant qui ne sont pas directement liés à son contenu, normalement dans une boîte de dialogue. Son comportement dépend du composant.
-
Copier copie le composant dans le presse-papiers pour le coller ailleurs. Le composant d’origine reste inchangé.
-
Couper copie le composant dans le presse-papiers. Le composant d’origine est supprimé.
-
Supprimer supprime le composant de la page après votre confirmation.
-
Insérer le composant ouvre la boîte de dialogue pour ajouter un nouveau composant.
-
Coller colle le composant du Presse-papiers vers la page. L’original est conservé ou non, selon que vous avez utilisé Copier ou Couper.
- Vous pouvez coller les composants sur la même page ou sur une autre.
- Si vous effectuez un collage sur une autre page qui était déjà ouverte avant l’opération de couper/copier, vous devez actualiser la page pour afficher le contenu collé.
- L’élément collé est collé au-dessus de l’élément pour lequel vous avez sélectionné l’action de collage.
- L’action de collage ne s’affiche que si du contenu se trouve dans le presse-papiers.
-
Group permet de sélectionner plusieurs composants à la fois. Vous pouvez obtenir le même résultat sur un ordinateur de bureau à l’aide des commandes Ctrl-clic ou Commande-clic.
-
Parent sélectionne le composant parent du composant sélectionné.
-
Mise en page permet de modifier la mise en page du composant sélectionné.
- Cela s’applique uniquement au composant sélectionné et n’active pas le mode de mise en page pour la page entière.
-
Convertir en variation de fragment d’expérience permet de créer un fragment d’expérience à partir du composant sélectionné ou de l’ajouter à un fragment d’expérience existant.
Boîte de dialogue de modification du composant component-edit-dialog
Certains composants offrent des options de modification supplémentaires par rapport à celles qui sont disponibles sur place. Vous pouvez ouvrir la boîte de dialogue de modification d’un composant à l’aide de l’icône Modifier (crayon) de la barre d’outils du composant pour accéder à des options de configuration supplémentaires.
Les options de modification exactes dépendent du composant. Pour certains composants certaines actions ne sont disponibles qu’en mode plein écran. Par exemple :
-
Composant textuel
-
Composant d’image
Modifier les composants en mode Plein écran edit-content-full-screen-mode
De nombreux composants offrent un mode Plein écran pour la modification, accessible avec ce bouton.
La modification en plein écran permet d’afficher plus d’options de modification que l’éditeur statique, comme pour le composant d’image.
Utilisez le bouton Réduire pour passer en mode plein écran.
Déplacement de composants moving-components
Pour déplacer un composant :
-
Sélectionnez le composant à déplacer en maintenant la touche enfoncée ou en maintenant la touche enfoncée.
-
Faites glisser le composant vers le nouvel emplacement.
- L’éditeur de page indique la position du composant avec un espace réservé et l’endroit où le paragraphe peut être déposé avec une cible.
-
Déposez-le à l’emplacement souhaité.
Modification de la disposition des composants editing-component-layout
Au lieu de basculer à plusieurs reprises entre les modes Modifier et de Disposition pour ajuster un composant, vous pouvez sélectionner l’action Disposition pour un composant afin d’en modifier la mise en page. Cela vous évite de devoir quitter le mode Modifier, ce qui se traduit par un gain de temps.
-
En mode Modifier de la console Sites, sélectionnez un composant pour afficher sa barre d’outils.
-
Sélectionnez l’action Mise en page pour ajuster la mise en page du composant.
-
Une fois l’action Disposition sélectionnée, vous pouvez modifier la disposition du composant comme vous le feriez en mode Disposition.
- Les poignées de redimensionnement du composant s’affichent.
- La barre d’outils de l’émulateur s’affiche en haut de l’écran.
- Les actions de mise en page au lieu des actions de modification standard s’affichent dans la barre d’outils du composant.
-
Après avoir effectué les modifications de disposition nécessaires, appuyez ou cliquez sur le bouton Fermer dans le menu d’action du composant pour arrêter de modifier la disposition du composant et la barre d’outils du composant revient à son état de modification normal.
Modification de l’héritage des composants inherited-components
L’héritage est le mécanisme par lequel le contenu peut être lié, de sorte que la modification de l’un modifie automatiquement l’autre. Les composants hérités peuvent être le produit de divers scénarios :
Vous pouvez annuler et réactiver l’héritage. Selon le composant, ces options sont disponibles à partir de la barre d’outils du composant, si le composant fait partie d’une Live Copy ou d’un lancement.
-
Annuler l’héritage
-
Réactivez l’héritage si l’héritage est déjà annulé.
-
Le déploiement est également disponible dans le plan directeur ou la source de Live Copy