Rich Text Editor Essentials

Présentation

Un éditeur de texte enrichi (RTE) permet de saisir du texte avec des annotations.

Pour les composants Communities, bien que semblable à l’éditeur de texte enrichi dans l’environnement d’auteur, il affecte le texte saisi dans l’environnement de publication.

éditeur de texte enrichi

Activation de l’éditeur de texte enrichi

Les composants de communautés qui autorisent le contenu généré par l’utilisateur (UGC) peuvent être activés pour autoriser RTE. Selon que le composant a été ajouté à une page ou inclus dans une fonction , RTE peut être activé ou non par défaut.

Si cette option n’est pas activée, il vous suffit d’entrer le mode d’édition de l’auteur, de sélectionner le composant à modifier et de cocher la case Rich Text Editor.

RTE est disponible pour les composants de communautés suivants :

Personnalisation

La personnalisation de l’éditeur de texte enrichi est possible car l’implémentation est basée sur CKEEditor.

La configuration actuelle des composants Communities se trouve dans le cq.social. scf clientlib, situé dans le référentiel à l’adresse

/libs/clientlibs/social/commons/scf/ckrte.js

La modification de cq.social.scf clientlib n’est pas recommandée car les mises à niveau ultérieures peuvent remplacer les modifications.

Pour des raisons de sécurité, les options d’hyperlien ne sont pas incluses dans l’ensemble d’icônes de texte enrichi présenté par défaut aux membres. La possibilité de faire des erreurs est considérable lorsque les trois types sont autorisés dans l'UGC.

Pour ajouter les options d’hyperlien à la barre d’outils :

  • Ajouter une barre d'outils nommée " links"
    • { name: 'links', items: [ 'Link','Unlink','Anchor' ] }
  • Sélectionner Enregistrer tout

/libs/clientlibs/social/commons/scf/ckrte.js

CKRte.prototype.config = {
    toolbar: [
        { name: "basicstyles",
           items: ["Bold", "Italic", "Underline", "NumberedList", "BulletedList", "Outdent", "Indent", "JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock", "TextColor"]
        },
        { name: 'links',
           items: [ 'Link','Unlink','Anchor' ]
        }
    ],
    autoParagraph: false,
    autoUpdateElement: false,
    removePlugins: "elementspath",
    resize_enabled: false
};

Sur cette page