Fundamentos do Editor de Rich Text

Última atualização em 2023-10-20
  • Tópicos
  • Communities
    Exibir mais informações sobre este tópico
  • Criado para:
  • User

Visão geral

Um Editor de Rich Text (RTE) permite inserir texto com marcação.

Para componentes das Comunidades, embora semelhantes ao editor de rich text no ambiente do autor, afeta o texto inserido no ambiente de publicação.

rich-text-editor

Ativação do editor de rich text

Os componentes das comunidades que permitem conteúdo gerado pelo usuário (UGC) podem ser habilitados para permitir RTE. Se o componente foi adicionado a uma página ou incluído em um função, o RTE pode ou não estar ativado por padrão.

Se não estiver ativado, basta inserir modo de edição do autor, selecione o componente para edição e selecione o Rich Text Editor caixa de seleção

O RTE está disponível para os seguintes componentes do Communities:

Personalização

A personalização do editor de rich text é possível, pois a implementação é baseada em CKEditor.

A configuração atual dos componentes do Communities está em cq.social. scf clientlib, no repositório em

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

Não é recomendado modificar o clientlib cq.social.scf, pois atualizações futuras podem substituir qualquer edição.

Por questões de segurança, as opções de hiperlink não estão incluídas no conjunto de ícones de rich text apresentado aos membros por padrão. A capacidade de danificar é extensa quando os hrefs são permitidos no UGC.

Para adicionar as opções de hiperlink à barra de ferramentas:

  • Adicione uma barra de ferramentas chamada " links"
    • { name: 'links', items: [ 'Link','Unlink','Anchor' ] }
  • Selecionar Salvar tudo

/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
};

Nesta página