Princípios básicos do editor de rich text

Visão geral

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

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

editor de rich text

Ativação do editor de rich text

Os componentes de Comunidades que permitem conteúdo gerado pelo usuário (UGC) podem ser habilitados para permitir o RTE. Dependendo de o componente ter sido adicionado a uma página ou incluído em uma função, o RTE pode ou não ser 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 Editor CKE.

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

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

A modificação da clientlib cq.social.scf não é recomendada, pois as atualizações futuras podem substituir qualquer edição.

Devido a questões de segurança, as opções de hiperlink não são incluídas no conjunto de ícones de rich text apresentados aos membros por padrão. A habilidade para o mal é extensa quando os hrefs são permitidos no UGC.

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

  • Adicionar 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