CKFinder Drupal Integration

By makeaweli

October 5, 2011 - 2 minutes read - 218 words

Replacing TinyMCE with CKEditor and CKFinder.

TinyMCEis a popular WYSIWYG editor I used by default on a few sites. However, it’s file/image uploader is very buggy and didn’t work well.

CKEditor is more actively developed and has a comparable file/image uploader.

CKEditor Install

There is a dedicated Drupal module for the CKEditor. However, the recommended method is to use the WYSIWYG module.

CKFinder Install

Unfortunately, CKFinder integration with CKEditor is not an easy process. Several core files need to be modified during this process.

Download and extract CKFinder into ~sites/all/libraries.

Modify drupal sites/default/settings.php

In order for CKFinder to work, it needs to verify that it’s running on the same domain it’s configured for. To help it out, we need to set a site cookie in the drupal config file:

We now need to tell CKFinder where our DocRoot is. Find all instances of the following and replace:

The following is the code section that needs to be modified:

Create Drupal module for CKFinder

We need to include the CKFinder javascript init file into every Drupal page.

I’ve written a Drupal module that does just this. You find it in subversion here:

Resources

Original Drupal integration posting:
http://drupal.org/node/648038

CKFinder javascript api change which resulted in an error because the setupCKEditor method is now starts with a lowercase ‘s’:
http://cksource.com/blog/CKEditor_for_jQuery