Ocultar um botão da barra de menus do CKEditor 4

Para ocultar um botão específico no CKEditor 4, você pode usar CSS ou JavaScript. Vou fornecer exemplos para ambos os casos.

Usando CSS: Você pode adicionar uma regra CSS para ocultar o botão desejado. Primeiro, você precisa identificar o ID ou a classe do botão. Vou usar o botão “Sublinhar” como exemplo.

  1. Identifique o ID ou classe do botão: Inspecione o elemento do botão no navegador para encontrar seu ID ou classe. Por exemplo, se o botão de sublinhar tem a classe cke_button__underline, você pode usar esse seletor.
  2. Adicione uma regra CSS para ocultar o botão: No seu arquivo CSS personalizado ou na tag <style>, adicione a seguinte regra:
.cke_button__underline {
  display: none !important;
}

Isso irá ocultar o botão de sublinhar.

Usando JavaScript: Se você quiser ocultar o botão dinamicamente usando JavaScript, você pode usar o método setCustomConfig do CKEditor para personalizar a configuração do editor. Aqui está um exemplo para ocultar o botão de sublinhar usando JavaScript:

<script>
  CKEDITOR.replace('editor', {
    // Outras configurações do CKEditor aqui...

    // Personalize a configuração do CKEditor para ocultar o botão de sublinhar
    on: {
      instanceReady: function (ev) {
        ev.editor.getCommand('underline').disable();
      }
    }
  });
</script>

Nesse exemplo, a função instanceReady é usada para obter o comando do botão de sublinhar e desabilitá-lo, tornando-o invisível.

Lembre-se de substituir 'editor' pelo ID ou nome do seu elemento <textarea> onde o CKEditor está sendo inicializado.

Esses são exemplos básicos de como ocultar um botão específico no CKEditor 4 usando CSS ou JavaScript. Você pode aplicar essas técnicas a outros botões ou personalizar ainda mais de acordo com suas necessidades.

Rolar para cima