Configuração de plug-ins para o editor de HTML TinyMCE

  • Versão de lançamento: Yokohama
  • Atualizado 30 de jan. de 2025
  • 4 min. de leitura
  • O editor de HTML TinyMCE é um editor de rich text poderoso, flexível e personalizável. Você pode configurar e estender o editor usando plug-ins.

    Tabela 1. Plug-ins compatíveis com o editor de HTML TinyMCE
    Nome do plug-in Descrição
    a11ychecker Permite que você verifique o HTML no editor em busca de vários problemas de acessibilidade de WCAG e Seção 508. Ele tem um recurso de reparo automático que permite que o usuário corrija os problemas identificados.
    acordeão Habilita a criação de seções em um documento que podem ser expandidas ou recolhidas para mostrar ou ocultar conteúdo adicional.
    listaadv Estende os controles principais da barra de ferramentas de lista de números e lista de touros adicionando formatos de número com estilo de lista de CSS e tipos de marcador aos controles.
    itens_lista_alinhamento Confirma que os marcadores e números estão alinhados com o conteúdo.
    âncora Adiciona um botão de âncora/marcador à barra de ferramentas que insere uma âncora no ponto de inserção do cursor do editor. Ele também adiciona a âncora do item de menu no menu Inserir.
    link automático Cria hiperlinks automaticamente quando você insere uma URL válida e completa. Por exemplo, www.example.com é convertido em http://www.example.com.
    redimensionar automaticamente Redimensiona o editor para o conteúdo dentro dele automaticamente. Normalmente, ele é usado para ajudar a impedir que o editor se expanda infinitamente conforme você insere texto na área editável.
    mapa de caracteres Adiciona uma caixa de diálogo ao editor com um mapa de caracteres Unicode especiais, que não podem ser adicionados diretamente do teclado.
    espelho de código Fornece um editor de código mais avançado do que a área de texto padrão.
    amostra de código Insira e incorpore snippets de código realçados com cores de sintaxe na área editável. Ele também adiciona um botão à barra de ferramentas que abre uma caixa de diálogo para aceitar a entrada de código bruto.
    direcionalidade Adiciona controles de direcionalidade à barra de ferramentas, permitindo que o TinyMCE lide melhor com os idiomas escritos da direita para a esquerda. Ele também adiciona um botão da barra de ferramentas para cada um de seus valores, ltr para texto da esquerda para a direita e rtl para texto da direita para a esquerda.
    emoticons Adiciona uma caixa de diálogo ao editor que permite inserir emoji na área editável do TinyMCE.
    tela cheia Adiciona capacidades de edição de tela inteira ao TinyMCE. Quando você pressiona o botão da barra de ferramentas, a área editável preenche a janela de visualização do navegador.
    imagem Permite que você insira uma imagem na área editável do TinyMCE.
    inserir data/hora Fornece um controle de barra de ferramentas e um item de menu que permite inserir a data e a hora atuais na área editável no ponto de inserção do cursor.
    link Permite que você vincule recursos externos, como URLs de sites, ao texto selecionado em seu documento.
    listas Permite que você adicione listas numeradas e com marcadores ao TinyMCE. Para habilitar listas avançadas, como listas com números alfabéticos e marcadores quadrados, você também deve habilitar o plug-in Advanced List (advlist).
    mídia Permite adicionar elementos de vídeo e áudio HTML5 à área editável.
    inviolável Adiciona um botão para inserir entidades de espaço sem quebra, como no ponto de inserção do cursor. Ele também adiciona um item de menu Espaço não separável na lista suspensa do menu Inserir e um botão da barra de ferramentas.
    quebra de página Adiciona suporte a quebra de página e permite que você insira quebras de página na área editável. Essa capacidade é útil quando um CMS usa um separador especial para dividir o conteúdo em páginas.
    Visualizar Adiciona um botão de visualização à barra de ferramentas que abre uma caixa de diálogo que mostra o conteúdo atual em um modo de visualização.
    somente leiturasem bordas Habilita um modo somente leitura para tipos de campo HTML.
    pesquisarsubstituir Adiciona caixas de diálogo de pesquisa e substituição ao TinyMCE.
    tabela Adiciona a funcionalidade de gerenciamento de tabelas ao TinyMCE, incluindo caixas de diálogo, menus de contexto, barras de ferramentas de contexto, itens de menu e botões da barra de ferramentas.
    sumário Gera um índice básico (ToC) e o insere no editor no ponto de inserção do cursor. As entradas de ToC são geradas a partir de elementos de cabeçalho no conteúdo.
    blocos visuais Permite que você veja elementos no nível de bloco na área editável.
    visualchars Adiciona a capacidade de ver caracteres invisíveis, como na área editável.
    contagem de palavras

    Adiciona a funcionalidade de contagem de palavras ao editor TinyMCE.

    Nota:
    Este plug-in não é mais compatível com espaços.
    powerpaste Limpa o conteúdo de Microsoft Word, Microsoft Excel, Google Docs e origens HTML automaticamente para criar um conteúdo limpo que corresponda à aparência do site.
    Nota:
    Adicionar um plug-in personalizado aos plug-ins válidos pode gerar resultados inesperados.

    Alterar os plug-ins do editor de HTML do TinyMCE

    Configure os plug-ins do TinyMCE em nossos espaços.

    Antes de Iniciar

    Função necessária: administrador

    Procedimento

    1. Navegar até Tudo > Propriedades do sistema > Propriedades da IU.
    2. Atualize a configuração do plug-in do campo HTML (TinyMCE v6.8.3) (glide.ui.html.editor.enabled_plugins) para configurar os plug-ins.

      Use uma barra vertical ("|") para adicionar um separador de seção.

      Tabela 2. Plug-ins para TinyMCE HTML Editor
      Tipo Plug-ins
      Plug-ins padrão
      • acordeão
      • listaadv
      • itens_lista_alinhamento
      • âncora
      • link automático
      • redimensionar automaticamente
      • mapa de caracteres
      • espelho de código
      • amostra de código
      • direcionalidade
      • emoticons
      • tela cheia
      • imagem
      • inserir data/hora
      • link
      • listas
      • mídia
      • inviolável
      • quebra de página
      • Visualizar
      • somente leiturasem bordas
      • pesquisarsubstituir
      • tabela
      • sumário
      • blocos visuais
      • visualchars
      • contagem de palavras
      Plug-ins habilitados
      • a11ychecker
      • acordeão
      • listaadv
      • itens_lista_alinhamento
      • âncora
      • link automático
      • mapa de caracteres
      • espelho de código
      • amostra de código
      • direcionalidade
      • emoticons
      • tela cheia
      • imagem
      • inserir data/hora
      • link
      • listas
      • mídia
      • inviolável
      • quebra de página
      • Visualizar
      • somente leiturasem bordas
      • pesquisarsubstituir
      • tabela
      • sumário
      • blocos visuais
      • visualchars
      • contagem de palavras
    3. Faça mudanças (adicionar/remover) na propriedade de plug-ins habilitados.
    4. Selecione Salvar.
      Se houver um plug-in personalizado adicionado aos plug-ins habilitados, isso não é recomendado, a menos que seja crítico.