Installing CKEditor to Drupal 7

Getting CKEditor installed to Drupal 7 is easy if you carefully follow the below steps.

Step 1: Download CKEditor

Go to http://ckeditor.com/download and download the latest version of CKEditor. Choose the package you want: Basic, Standard, Full and click the download button.

Step 2: Upload CKEditor files

Unpack the contents of the archive and upload it to your server to the following path:

%drupal%\sites\all\modules\

Here, %drupal% is the local path on your site where Drupal 7 is installed. So, you should end up with the ckeditor directory inside the above path containing all the files:

%drupal%\sites\all\modules\ckeditor\

Step 3: Download CKEditor Drupal module

Now, you need to install the Drupal module that will enable CKEditor functionality. Go to https://www.drupal.org/project/ckeditor to download the CKEditor module:

Download the version 7.x, then unpack it and upload the contents to:

%drupal%\sites\all\modules\ckeditor\

Therefore, you should end up with the ckeditor directory inside the above path containing all the files of the Drupal module:

%drupal%\sites\all\modules\ckeditor\ckeditor\

Step 4: Activate the CKEditor module

Open Drupal 7 Administration and go to Modules. Scroll down to the User Interface section and make sure CKEditor is activated.

Save configuration. Now, CKEditor is enabled and you can edit your content using it:

Step 5: Installing plugins to CKEditor for Drupal 7

Basically, you can use installation guides of individual plugins published on our website. However, installing plugins to Drupal 7 has its own specifics.

Let’s see, how you can install File Manager plugin for CKEditor.

Download the plugin, then upload it to your site. You need to copy the contents of the plugin to two folders:

sites/all/modules/ckeditor/plugins

and to:

sites/all/modules/ckeditor/ckeditor/plugins

Then, go to the 'Administration | Configuration | Content authoring' and select the 'CKEditor' section.

Select the editor profile you want to edit, click 'edit' and scroll down to the Plugins section within the Editor Appearance options block. Enable the File Manager plugin there and save settings. Congratulations, you have installed the File Manager plugin to CKEditor in Drupal 7.

Note that CKEditor provides a visual toolbar editor in the Editor Appearance block. You can use the toolbar constructor tool to add or remove buttons to/from the CKEditor toolbar including buttons of installed CKEditor plugins.

Editing CKEditor’s config.js in Drupal 7

If you need to edit config.js in Drupal 7, you don’t need to do this manually. Instead, go to 'Administration | Configuration | Content authoring', select the CKEditor profile and click 'edit'.

Now, open the 'Advanced options' options block and see the 'Custom JavaScript Configuration' setting.

Put any custom CKEditor configuration lines you want here and save settings.