Création de contenu avec l’éditeur universel

Découvrez à quel point il est facile et intuitif pour les personnes en charge de la création de créer du contenu à l’aide de l’éditeur universel.

Présentation

L’éditeur universel permet de modifier n’importe quel aspect de contenu dans n’importe quelle mise en oeuvre afin de proposer des expériences exceptionnelles, d’augmenter la vitesse du contenu et de fournir une expérience de développement à la pointe de la technologie.

Pour ce faire, l’éditeur universel offre aux auteurs de contenu une interface utilisateur intuitive qui nécessite une formation minimale pour simplement pouvoir intervenir et commencer à modifier le contenu. Ce document décrit l’expérience de création d’Universal Editor.

Préparer l’application

Pour créer du contenu pour une application à l’aide d’Universal Editor, l’application doit être instrumentée par un développeur afin de prendre en charge l’éditeur.

Se connecter

Une fois que l’application est instrumentée pour fonctionner avec l’éditeur universel, vous devez vous connecter à l’éditeur universel. Vous aurez besoin d’un Adobe ID pour vous connecter et d’avoir accès à l’éditeur universel.

Une fois connecté, saisissez l’URL de la page à modifier dans le la barre d’emplacement. pour pouvoir commencer à modifier du contenu, par exemple contenu texte ou contenu multimédia.

Présentation de l’interface utilisateur

L’interface utilisateur est divisée en cinq zones principales.

• En-tête Experience Cloud
• En-tête de l’éditeur universel
• Le rail de mode
• L’éditeur
• Rail des composants

En-tête Experience Cloud

L’en-tête Experience Cloud est toujours présent en haut de l’écran. Il s’agit d’une ancre de lien qui vous indique où vous vous trouvez dans Experience Cloud et vous aide à accéder à d’autres applications Experience Cloud.

Experience Manager

Sélectionnez le lien Adobe Experience Cloud à gauche de l’en-tête pour accéder à la racine de votre solution Experience Manager et aux outils tels que Cloud Manager, Cloud Acceleration Manager et Distribution logicielle.

Organisation

L’organisation dans laquelle vous êtes actuellement connecté s’affiche. Appuyez ou cliquez sur pour passer à une autre organisation si votre Adobe ID est associé à plusieurs d’entre elles.

Solutions

Appuyez ou cliquez sur le sélecteur de solutions pour accéder rapidement à d’autres solutions Experience Cloud.

Aide

L’icône d’aide permet d’accéder rapidement aux ressources d’apprentissage et d’assistance.

Notifications

Cette icône comporte un badge indiquant le nombre d’éléments incomplets actuellement attribués. notifications.

Propriétés de l’utilisateur ou de l’utilisatrice

Appuyez ou cliquez sur l’icône représentant votre utilisateur ou votre utilisatrice pour accéder à vos paramètres utilisateur. Si aucune image d’utilisateur n’est configurée, une icône est attribuée de manière aléatoire.

En-tête de l’éditeur universel

L’en-tête de l’éditeur universel est toujours présent en haut de l’écran, juste en dessous de l’en-tête Experience Cloud. Il vous permet d’accéder rapidement à une autre page pour la modifier et la publier.

Le menu Hamburger

Le menu Hamburger n’a pas encore été mis en œuvre.

Barre d’emplacement

La barre d’emplacement affiche l’adresse de la page que vous modifiez. Appuyez ou cliquez pour saisir l’adresse d’une autre page à modifier.

Paramètres de l'émulateur

Appuyez ou cliquez sur l’icône d’émulation pour définir la manière dont l’éditeur universel effectue le rendu de la page.

Appuyez ou cliquez sur l’icône d’émulation pour afficher les options.

Par défaut, l’éditeur s’ouvre dans la mise en page pour ordinateur où la hauteur et la largeur sont automatiquement définies par le navigateur.

Vous pouvez également choisir d’émuler un appareil mobile et dans l’éditeur universel :

• Définir son orientation
• Définir la largeur et la hauteur
• Modification de l’orientation

Ouvrir l’aperçu de l’application

Appuyez ou cliquez sur l’icône d’aperçu de l’application ouverte pour ouvrir la page que vous êtes en train de modifier dans son propre onglet de navigateur, sans l’éditeur pour prévisualiser votre contenu.

Publier

Appuyez ou cliquez sur le bouton Publier afin de publier les modifications apportées au contenu en direct pour que vos lecteurs puissent les utiliser.

Rail de mode

Le rail de mode est toujours présent le long du côté gauche de l’éditeur. Cela permet de basculer facilement l’éditeur entre différents modes de modification.

Mode Aperçu

En mode Aperçu, la page rendue dans l’éditeur est telle qu’elle apparaîtrait sur votre service publié. Cela permet à la personne en charge de la création de contenu de parcourir le contenu en cliquant sur des liens, etc.

Mode multimédia

En mode multimédia, l’auteur du contenu peut cliquer pour sélectionner le contenu multimédia.

Les détails du contenu s’affichent dans le rail du composant et l’auteur peut également modifiez le contenu multimédia.

Mode de composant

En mode Composant, l’auteur du contenu peut cliquer pour sélectionner des composants afin de les modifier, notamment :

• Modification de texte brut en place.
• Modification de texte enrichi en place avec des options de mise en forme supplémentaires affichées dans le rail du composant.
• Modification de fragments de contenu

Lorsque vous sélectionnez une Fragment de contenu, les détails s’affichent dans le rail du composant où vous pouvez modifier le fragment de contenu.

L’éditeur

L’éditeur occupe la majeure partie de la fenêtre et est l’endroit où la page indiquée dans la barre d’emplacement ; est rendue.

• Si l’éditeur se trouve dans mode composant, le contenu sera modifiable, mais vous ne pouvez pas suivre les liens.
• Si l’éditeur se trouve dans mode aperçu, le contenu sera navigable et vous pouvez suivre les liens, mais vous ne pouvez pas le modifier.

Rail des composants

Le rail du composant est toujours présent le long du côté droit de l’éditeur. En fonction de son mode, il peut afficher les détails d’un composant sélectionné dans le contenu ou la hiérarchie du contenu de la page.

Mode Propriétés

En mode Propriétés, le rail affiche les propriétés du composant actuellement sélectionné dans l’éditeur. Il s’agit du mode par défaut du rail des composants lorsqu’une page est chargée.

Selon le type de composant sélectionné, les détails peuvent être affichés et modifiés dans le rail des propriétés.

Notez que tous les composants ne comportent pas de détails qui peuvent être affichés et/ou modifiés.

Modifier

Dans mode composant, les options de modification du composant sélectionné s’affichent dans le rail du composant. Dans le rail du composant, vous pouvez modifier le composant sélectionné. Vous pouvez également appuyer ou cliquer sur le bouton Modifier.

Appuyez ou cliquez sur le bouton Modifier pour ouvrir la Éditeur de fragment de contenu dans un nouvel onglet. Cela vous permet d’accéder à toute la puissance de l’éditeur de fragments de contenu pour modifier le fragment de contenu associé.

Selon les besoins de votre workflow, vous pouvez modifier le fragment de contenu dans l’éditeur universel ou directement dans l’éditeur de fragment de contenu.

Mode Arborescence de contenu

En mode Arborescence de contenu, le rail affiche la hiérarchie du contenu de la page.

Lors de la sélection d’un élément dans l’arborescence de contenu, l’éditeur fait défiler le contenu jusqu’à ce qu’il le sélectionne.

Ajouter

Si vous sélectionnez un composant de conteneur dans l’arborescence de contenu ou dans l’éditeur, l’option d’ajout s’affiche sur le rail du composant.

Appuyez ou cliquez sur le bouton d’ajout pour ouvrir un menu déroulant des composants disponibles pour ajoutez au conteneur sélectionné.

Supprimer

Si vous sélectionnez un composant dans un composant de conteneur dans l’arborescence de contenu ou dans l’éditeur, l’option de suppression s’affiche sur le rail du composant.

Appuyez ou cliquez sur le bouton de suppression supprime le composant.

Modification du contenu

La modification du contenu est simple et intuitive. Dans les modes de modification (mode média et mode composant), lorsque vous placez le pointeur de la souris sur le contenu de l’éditeur, le contenu modifiable est mis en surbrillance avec une zone bleue.

Selon le mode vous vous trouvez dans et le contenu que vous sélectionnez ; il se peut que vous disposiez de différentes options de modification en place et que vous puissiez consulter des propriétés supplémentaires pour le contenu à l’aide de la variable rail de composant.

Modification de texte brut

Si vous êtes dans mode composant et sélectionnez un composant de texte brut, vous pouvez modifier le texte en place en double-cliquant ou en appuyant deux fois sur le composant.

Appuyez sur Entrée/Retour ou appuyez ou cliquez en dehors de la zone de texte pour enregistrer vos modifications.

Lorsque vous appuyez ou cliquez pour sélectionner le composant de texte, ses détails s’affichent dans le rail du composant. Vous pouvez également modifier le texte dans le rail.

De plus, des détails sur votre texte sont disponibles dans le rail de composant. Les modifications sont automatiquement enregistrées lorsque le focus quitte le champ modifié dans le rail du composant.

Modification de texte enrichi

Si vous êtes dans mode composant et sélectionnez un composant de texte enrichi, vous pouvez modifier le texte en place en double-cliquant ou en appuyant deux fois sur le composant.

Appuyez sur Entrée/Retour ou appuyez ou cliquez en dehors de la zone de texte pour enregistrer vos modifications.

En outre, les options de mise en forme et les détails de votre texte sont disponibles dans le rail du composant. Les modifications sont automatiquement enregistrées lorsque le focus quitte le champ modifié dans le rail du composant.

Modification du média

Si vous êtes dans mode média et que vous sélectionnez une image, vous pouvez afficher ses détails dans le rail de composant.

Appuyez ou cliquez sur le bouton Remplacer en dessous de l’aperçu de l’image sélectionnée dans le rail du composant pour remplacer l’image par une autre de votre bibliothèque de ressources.

1. La variable sélecteur de ressources s’ouvre pour vous permettre de sélectionner une ressource.
2. Appuyez ou cliquez sur pour sélectionner une nouvelle ressource.
3. Appuyez ou cliquez sur Sélectionner pour revenir au rail du composant dans lequel la ressource a été remplacée.

Les modifications sont automatiquement enregistrées dans votre contenu.

Modification de fragments de contenu

Si vous êtes dans mode composant et vous sélectionnez une Fragment de contenu, vous pouvez modifier ses détails dans le rail des composants.

Les champs définis dans le modèle de contenu du fragment de contenu sélectionné sont affichés et modifiables dans le rail du composant.

Si vous sélectionnez un champ lié à un fragment de contenu, celui-ci se charge dans le rail des composants et le champ est automatiquement défilé vers .

Les modifications sont automatiquement enregistrées lorsque le focus quitte le champ modifié dans le rail du composant.

Si vous souhaitez modifier votre fragment de contenu dans le Éditeur de fragment de contenu cliquez sur bouton d’édition dans le rail de mode.

Selon les besoins de votre workflow, vous pouvez modifier le fragment de contenu dans l’éditeur universel ou directement dans l’éditeur de fragment de contenu.

Ajout de composants aux conteneurs

1. Sélectionnez un composant de conteneur dans l’arborescence de contenu ou dans l’éditeur.

2. Appuyez ou cliquez ensuite sur l’icône d’ajout dans le rail du composant.

   

Le composant est inséré dans le conteneur et peut être modifié dans l’éditeur.

Suppression de composants des conteneurs

1. Sélectionnez un composant de conteneur dans l’arborescence de contenu ou dans l’éditeur.

2. Appuyez ou cliquez sur l’icône chevron du conteneur pour développer son contenu dans l’arborescence de contenu.

3. Sélectionnez ensuite, dans l’arborescence de contenu, un composant dans le conteneur.

4. Appuyez ou cliquez sur l’icône de suppression dans le rail des composants.

   

Le composant sélectionné a été supprimé.

Réorganisation des composants dans les conteneurs

1. Sélectionnez un composant de conteneur dans l’arborescence de contenu ou dans l’éditeur.

2. Si ce n’est pas déjà fait dans le mode arborescence de contenu, passez-y.

3. Appuyez ou cliquez sur l’icône chevron du conteneur pour développer son contenu dans l’arborescence de contenu.

4. Faites glisser les icônes de poignée en regard des composants dans le conteneur pour afficher que vous puissiez les réorganiser. Faites glisser les composants pour les réorganiser dans le conteneur.

   

5. Le composant déplacé devient gris dans l’arborescence du composant, tandis que votre point d’insertion est représenté par une ligne bleue. Libérez le composant pour le placer à son nouvel emplacement.

Les composants sont réorganisés dans l’arborescence de contenu et dans l’éditeur.

Prévisualisation du contenu

Une fois le contenu modifié, vous aimez généralement le parcourir pour voir à quoi il ressemble dans le contenu d’autres pages. En mode Aperçu, vous pouvez cliquer sur les liens pour parcourir votre contenu comme le ferait un lecteur ou une lectrice. Le contenu est rendu dans l’éditeur tel qu’il serait publié.

Notez qu’en mode Aperçu, le fait d’appuyer ou de cliquer sur le contenu fait réagir ce dernier comme il le ferait avec un lecteur ou une lectrice du contenu. Si vous souhaitez sélectionner le contenu à modifier, basculez vers un mode de modification tel que mode composant ou mode média.

Ressources supplémentaires

Pour en savoir plus sur l’éditeur universel, consultez ces documents.

• Présentation de l’éditeur universel - Découvrez comment Universal Editor permet de modifier n’importe quel aspect de contenu dans n’importe quelle mise en oeuvre afin de vous permettre de proposer des expériences exceptionnelles, d’augmenter la vitesse du contenu et de fournir une expérience de développement à la pointe de la technologie.
• Publication de contenu avec l’éditeur universel - Découvrez comment l’éditeur visuel universel publie du contenu et comment vos applications peuvent gérer le contenu publié.
• Prise en main de l’éditeur universel dans AEM - Découvrez comment accéder à l’éditeur universel et comment commencer à instrumenter votre première application AEM pour l’utiliser.
• Architecture de l’éditeur universel - Découvrez l’architecture de l’éditeur universel et le flux de données entre ses services et calques.
• Attributs et types - Découvrez les attributs et les types de données requis par l’éditeur universel.
• Authentification de l’éditeur universel - Découvrez comment l’éditeur universel s’authentifie.

Ressources Business.Adobe.com