Configure CKeditor

Configuring CKEditor

There are a number of different ways to configure CKeditor

  1. It can be configured using the config.js file found in the root ckeditor folder.
  2. Using a custom configuration file that we specify.
  3. Configure inline what instantiating the editor
METHOD #1: Use default config.js file in root ckeditor folder

The con of configuring CKEditor using this file is that if we upgrade CKEditor, We'll have to remember not to override our configuration. As a result this method is not ideal.

//the root config.js file in the ckeditor.

CKEDITOR.editorConfig = function( config ) {
        // Define changes to default configuration here. For example:
        // config.language = 'fr';
        // config.uiColor = '#AADC6E';
};
 
METHOD #2: specify custom javascript configuration file.

To speficy a custom configuration file we use the "customConfig" key. The value is passed in an object as the second parameter to the CKEDITOR.replace method.

CKEDITOR.replace( 'editor1', {
    customConfig: '/custom/ckeditor_config.js'
});

 

Our custom javascript file.

//Our custom javascript file

CKEDITOR.editorConfig = function( config ) {
        // Define changes to default configuration here. For example:
        // config.language = 'fr';
        // config.uiColor = '#AADC6E';
};
 
METHOD #3: Inline Configuration
//add the configuration directly.
CKEDITOR.replace( 'editor1', {
    disableObjectResizing: true
});
Cookbook Category: 

Add new comment