Modification du code source dans l’éditeur de contenu enrichi

  • Rversion finale: Zurich
  • Mis à jour 31 juil. 2025
  • 2 minutes de lecture
  • Modifiez le code source HTML et CSS de tous les éléments du canevas ou d’un élément spécifique.

    Créez la mise en page à l’aide d’éléments HTML, modifiez directement le CSS d’un élément pour ajouter un style qui n’est pas disponible dans l’interface du canevas, ou copiez-collez du code pour migrer le contenu à partir d’autres sources.Ajoutez une bordure autour d’une ligne et personnalisez la police de l’en-tête

    Fonctionnalités et capacités

    Garantir la sécurité du portail
    Lorsque vous cliquez sur Appliquer dans la fenêtre Modifier le code, l’éditeur de code supprime les balises HTML qui pourraient être utilisées pour compromettre votre instance. Pour plus d'informations, consultez HTML sanitizer.
    Identifier le code important
    La fenêtre d’édition met en surbrillance les fragments CSS en rouge s’ils ne doivent pas être supprimés. Cela indique soit un paramètre qui fait partie du thème du portail, soit que plusieurs éléments utilisent ce code.
    En outre, si vous supprimez une règle CSS référencée par l’un des éléments HTML suivants, l’éditeur de code rétablit la règle CSS :
    • Ligne
    • Cellule
    • Canevas
    • Diviseur
    • Bouton
    • Bloc de liens
    • Onglets
    Supprimer le code inutile
    Lorsque vous enregistrez vos modifications, l’éditeur de code supprime toutes les règles CSS inutilisées.
    Inversement, si l’éditeur de code rétablit une règle CSS que vous essayez de supprimer, mettez en surbrillance ce bloc de code CSS et cliquez sur le bouton Supprimer CSS pour remplacer l’éditeur de code.
    Figure 1. Exemple d’utilisation du bouton Supprimer CSS

    Dans la vidéo suivante, l’utilisateur tente de supprimer une règle CSS à l’aide de la touche de suppression, mais le système rétablit le code. Ensuite, l’utilisateur met le code en surbrillance et clique sur Supprimer CSS, ce qui supprime le code avec succès.

    L’utilisateur tente sans succès de supprimer une règle CSS à l’aide de la touche Suppr. Il utilise donc le bouton Supprimer CSS, qui supprime le code en surbrillance
    Remarque :
    Cette fonctionnalité n’est pas disponible par défaut. Un administrateur doit activer la propriété Modifier le code . Reportez-vous à la rubrique Propriétés installées avec Content Publishing.

    Considérations importantes

    • L’ajout de HTML et de CSS personnalisés peut casser votre conception. Procédez avec prudence lorsque vous utilisez cette fonctionnalité. L’éditeur de contenu enrichi ne suit pas les changements dans l’éditeur de code, de sorte que le bouton Annuler n’annulera pas de manière fiable les changements de code.
    • Nous vous déconseillons d’utiliser des éléments HTML (tels que div ou p) pour définir des règles CSS, car cela peut avoir des conséquences imprévues.
      Figure 2. Exemple de résultat inattendu lors de l’utilisation d’un élément HTML pour définir une règle CSS

      Dans l’exemple suivant, l’utilisateur définit une règle CSS pour l’élément p dans une cellule. Toutefois, dans l’aperçu de la page, les règles de style s’appliquent aux éléments p dans toutes les zones de texte, ainsi que dans le pied de page.

      L’utilisateur définit une règle CSS à l’aide de l’élément HTML p pour une cellule, mais la règle est appliquée sur l’ensemble de la page
    • Différents navigateurs peuvent présenter différents comportements de copier/coller. Si appuyer sur Ctrl+V ne duplique pas le contenu comme prévu, cliquez sur l’icône dupliquer dans la barre d’outils du composant.
    • Si le contenu copié-collé ne conserve pas son style (comme la police) et que l’ajustement des paramètres n’aide pas, effacez le style en cliquant sur le « x » à côté du champ de style, puis définissez le style.Supprimez l’application de style personnalisée en cliquant sur le « x » à côté du champ d’application de style
    • Si le contenu collé apparaît différemment lors de l’enregistrement, cela est probablement dû au fait que certaines balises de script ont été supprimées par l’assainisseur HTML.