Customizing the CKEditor toolbar using the config.js file

Home > Search

When downloading CKEditor, there is an option to use the basic, standard, or full version of CKEditor. It is usually best to select the package that has  the buttons you would like to use. After downloading CKEditor, you will move the CKEditor folder to your web server. In the CKEditor folder is a file named config.js

To modify the toolbar, revise the config.js file to list your preferred toolbar options. The following is an example of how to choose the buttons you want displayed in your toolbar by referencing each item.

CKEDITOR.editorConfig = function( config ) { 
  config.toolbar = 'MyToolbar'; 
  config.toolbar_MyToolbar = [ 
    { name: 'document', items : [ 'Source','Save' ] }, 
    { name: 'editing', items : [ 'Scayt', 'TextColor', 'BGColor' ] }, 
    { name: 'insert', items : [ 'Image','CodeSnippet','Table','HorizontalRule','Blockquote' ] }, 
    { name: 'basicstyles', items : [ 'Bold','Italic','Underline', 'Strike' ] }, 
    { name: 'paragraph', items : [ 'NumberedList','BulletedList','Indent','Outdent' ] }, 
    { name: 'links', items : [ 'Link','Unlink','Anchor' ] }, 
    { name: 'tools', items : [ 'Maximize','ShowBlocks' ] } 



Add a Comment

We will never share your name or email with anyone. Enter your email if you would like to be notified when we respond to your comment.

Please enter in the box below so that we can be sure you are a human.