How to remove buttons from CKeditor 4

Question

The question is in the title : How to remove buttons from CKeditor 4 .

Documentation does not answer it clearly

Answer 1

Based on reinmar answer and tested here is the better answer. Add this in your ckeditor config.js :

config.removeButtons = 'Underline,JustifyCenter';

For reference you can find the complete list of CKeditor 4 buttons there : http://ckeditor.com/comment/123266#comment-123266

Answer 2

I finaly found how, but I don't like this way as instead of removing what you don't want, you define which buttons you want (and simply don't put what you don't want). When you call CKeditor.replace you can define the toolbar like so:

    CKEDITOR.replace( 'YOURE_TEXT_AREA_ID', {
    toolbar: [
    { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source', '-', 'Save', 'NewPage', 'Preview', 'Print', '-', 'Templates' ] },
    { name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },
    { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ], items: [ 'Find', 'Replace', '-', 'SelectAll', '-', 'Scayt' ] },
    { name: 'forms', items: [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },
    '/',
    { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
    { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'BidiLtr', 'BidiRtl', 'Language' ] },
    { name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] },
    { name: 'insert', items: [ 'Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak', 'Iframe' ] },
    '/',
    { name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
    { name: 'colors', items: [ 'TextColor', 'BGColor' ] },
    { name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] },
    { name: 'others', items: [ '-' ] },
    { name: 'about', items: [ 'About' ] }
]
});

(For reference this is the standard full toolbar) Items represent buttons so simply delete the items you don't want. Thats it.

Is there any better answer ?

Answer 3

To remove buttons, try:

$(document).ready(function() {
   CKEDITOR.config.removePlugins = 'Save,Print,Preview,Find,About,Maximize,ShowBlocks';
});

The comma-separated list must contain the name of each button you want to remove. The following link is the complete list of the buttons containing the toolbar ckeditor:

list-buttons

Answer 4

In config.js file inside scripts/ckeditor/ of your project, just do the following way

config.removePlugins = 'elementspath,save,image,flash,iframe,link,smiley,tabletools,find,pagebreak,templates,about,maximize,showblocks,newpage,language';

config.removeButtons = 'Copy,Cut,Paste,Undo,Redo,Print,Form,TextField,Textarea,Button,SelectAll,NumberedList,BulletedList,CreateDiv,Table,PasteText,PasteFromWord,Select,HiddenField';

Answer 5

After much fooling around with manually removing button and styling the toolbar by editing the config.js file, I found the ToolBar Configurator.

With that you can easily enable or disable buttons. Change button group order and add separators.

It is located in the /samples/toolbarconfigurator of the ckeditor folder. Just launch the index.html. The Toolbar Configurator is inlcuded in all the different download packages on the download page

When you are done creating your toolbar, just click Get toolbar config and copy the style to the config.js file located in the main ckeditor folder.

Answer 6

There is a handy tool come by default with the bundle, which can be found at ckeditor/samples/toolbarconfigurator/index.html. It allows you to config the toolbar using GUI.

Answer 7

Open your config.js file and paste this code

CKEDITOR.editorConfig = function( config ) {
    // Define changes to default configuration here. For example:
    // config.language = 'fr';
    // config.uiColor = '#AADC6E';
    config.removePlugins = 'blockquote,save,flash,iframe,tabletools,pagebreak,templates,about,showblocks,newpage,language,print,div';
    config.removeButtons = 'Print,Form,TextField,Textarea,Button,CreateDiv,PasteText,PasteFromWord,Select,HiddenField,Radio,Checkbox,ImageButton,Anchor,BidiLtr,BidiRtl,Font,Format,Styles,Preview,Indent,Outdent';
};

Answer 8

Its so Simple. Modify config.js file as below

CKEDITOR.editorConfig = function (config) {

config.removePlugins = 'save,newpage,flash,about,iframe,language'; 
//The options which you don't need in the toolbar, you can add them in the above remove plugins list.

};

Answer 9

Try

config.removeButtons = 'Save'; 

this will completely remove the save button.

Answer 10

CKEDITOR.config.removePlugins = 'elementspath,save,about,forms,find,selectall,specialchar,flash,smiley,iframe,showblocks,language';