CHAPITRE 10 — Modifier les textes
La modification d'un texte est l'opération la plus fréquente dans le Studio. Ce chapitre présente les trois méthodes pour y procéder, ainsi que les différents types de champs que vous rencontrerez.
Méthode 1 — Édition directe depuis l'aperçu
C'est la méthode la plus rapide et la plus naturelle.
- Ouvrez la page que vous souhaitez modifier en cliquant sur son nom dans la colonne de gauche.
- Dans l'aperçu central, survolez avec la souris : les zones éditables sont entourées d'un cadre orange en pointillés.
- Cliquez sur le texte à modifier.
- L'inspecteur s'ouvre à droite avec un champ déjà rempli.
- Modifiez le texte. L'enregistrement automatique intervient une demi-seconde après votre dernière saisie.
- L'aperçu se met à jour en direct.
Recommandé — L'indicateur « Enregistré » à côté du champ confirme la sauvegarde en brouillon. Pour rendre la modification visible publiquement, cliquez sur Publier les modifications en haut à droite.
Méthode 2 — Liste « Contenu de la page »
Cette méthode est utile lorsqu'un slot n'est pas directement cliquable, par exemple une image masquée ou une valeur stockée dans un attribut.
- Ouvrez la page sans cliquer sur l'aperçu.
- Consultez la colonne de droite.
- La liste « Contenu de la page » répertorie tous les emplacements éditables.
- Chaque ligne présente un type, un libellé, un aperçu de la valeur et un repère « modifié » en cas de brouillon en cours.
- Cliquez sur la ligne souhaitée pour ouvrir son formulaire.
Conseil — Les slots sont regroupés par section (« hero », « pied de page », « appel à l'action », etc.) selon le découpage défini par votre développeur. Cela facilite la navigation sur les pages longues.
Méthode 3 — Navigation par sections
Sur les pages longues, vous pouvez utiliser la barre de défilement de l'aperçu pour atteindre la section recherchée, puis cliquer dessus directement.
Les types de champs disponibles
Le développeur a choisi un type pour chaque slot. Ce type détermine l'apparence du formulaire d'édition. Voici l'ensemble des types existants.
Texte court
Champ d'une seule ligne, sans mise en forme. Convient pour les titres, les libellés et les noms. Une longueur maximale peut être imposée, auquel cas un compteur de caractères est affiché.
Texte long
Champ multi-lignes sans mise en forme. Les sauts de ligne sont autorisés et automatiquement convertis en retours visuels. Idéal pour une accroche ou un paragraphe simple.
Texte riche
Éditeur visuel complet (CKEditor) avec barre d'outils étendue.
Outil | Effet |
|---|---|
Format | Paragraphe, Titre 2, Titre 3, Titre 4, Code |
Style | Gras, italique, souligné, barré |
Couleur | Couleur de texte et couleur de fond, selon la palette de la marque |
Alignement | Gauche, centre, droite, justifié |
Listes | Listes à puces, listes numérotées, indentation |
Liens | Insérer ou supprimer un lien |
Insérer un média | Ouvre la bibliothèque pour insérer une image au curseur |
Note importante — L'éditeur ne propose pas de bouton « source » pour modifier le HTML brut. Ce choix est délibéré, comme expliqué au Chapitre 3.
Image
Le champ comporte une zone de saisie, un bouton de sélection dans la bibliothèque, un bouton de suppression et une vignette d'aperçu.
- Cliquez sur le bouton Choisir une image.
- La bibliothèque média s'ouvre dans une fenêtre.
- Sélectionnez une image existante ou téléversez-en une nouvelle.
- L'image est intégrée et la vignette s'affiche.
Conseil — Vous pouvez également glisser-déposer une image depuis la barre latérale Médias directement sur la zone d'image dans l'aperçu central.
URL
Champ texte adapté aux liens. Les mêmes outils que pour les images sont disponibles, par exemple le sélecteur pour insérer un média comme cible.
Icône
Champ de sélection d'une icône FontAwesome.
- Saisissez le nom de la classe (par exemple
fa-solid fa-star) ou cliquez sur l'une des vingt icônes proposées (étoile, cœur, fusée, etc.). - Choisissez la couleur dans le sélecteur.
- Un aperçu en direct s'affiche.
Couleur
Sélecteur de couleur HTML5 accompagné d'un champ hexadécimal.
- Format strict :
#RRGGBBou#RRGGBBAA(avec transparence). - Bouton Défaut pour revenir à la valeur initiale.
- Une couleur n'est pas traduisible et reste identique dans toutes les langues.
Nombre
Champ numérique simple avec validation.
Booléen
Case à cocher pour un choix oui ou non.
Liste déroulante
Le panneau d'édition multilingue
Pour les slots de type texte (texte court, texte long, texte riche), l'inspecteur présente trois zones distinctes.
Zone | Contenu |
|---|---|
Champ principal | La langue actuellement affichée dans l'aperçu (drapeau actif). C'est ici que vous saisissez la majorité du temps. |
Autres langues (dépliable) | Un champ par langue prise en charge. Cliquez sur la flèche pour déplier et saisir les traductions. |
Options avancées (dépliable) | La valeur canonique partagée entre toutes les langues. À ne modifier qu'en cas de besoin spécifique. |
Note — Au moment du rendu public, le module recherche la valeur dans cet ordre : surcharge dans la langue du visiteur, valeur canonique, valeur par défaut. Le visiteur voit toujours un contenu, même en l'absence de traduction.
Pour les slots non textuels (image, couleur, icône, etc.), une seule zone « Valeur (toutes langues) » est proposée. Une image se traduit rarement.
L'enregistrement automatique en pratique
Aucun bouton « Enregistrer » n'est à cliquer. Le module sauvegarde automatiquement votre travail.
- Vous saisissez du texte.
- Le module attend une demi-seconde de pause.
- L'indicateur passe à Enregistrement....
- Le serveur reçoit la valeur et l'enregistre comme brouillon.
- L'indicateur passe à Enregistré en vert.
Conseil — Si l'indicateur affiche « Erreur réseau », votre connexion a probablement été interrompue. Utilisez Ctrl+Z pour récupérer votre saisie, attendez le rétablissement de la connexion, puis ressaisissez.
Annuler une modification non publiée
Tant que vous n'avez pas publié, plusieurs options de retour en arrière sont possibles :
- Annulation locale : utilisez Ctrl+Z dans le champ pour revenir frappe par frappe.
- Annulation globale de la page : cliquez sur Annuler les modifications dans la barre d'outils. Tous les brouillons de la page courante sont alors supprimés.
Avertissement — Le bouton « Annuler les modifications » est définitif. Une confirmation est demandée. Une fois validée, le brouillon est perdu et la page revient à sa version publique.
Récapitulatif
Vous savez désormais :
- Cliquer sur un texte de l'aperçu pour l'éditer.
- Utiliser la liste « Contenu de la page » pour les slots non cliquables.
- Reconnaître les neuf types de champs (texte court, texte long, texte riche, image, URL, icône, couleur, nombre, liste).
- Distinguer la valeur d'une langue, la valeur canonique et la valeur par défaut.
- Comprendre le fonctionnement de l'enregistrement automatique en brouillon.
- Annuler une modification avant publication.
Le chapitre suivant aborde la bibliothèque média.