IMCE integration with CKEDITOR

Features of IMCE

IMCE is an image/file uploader and browser that supports personal directories and quota.

  • Basic file operations: upload, delete
  • Image(jpg, png, gif) operations: resize, create thumbnails, preview
  • Support for private file system
  • Configurable limits for user roles: file size per upload, directory quota, file extensions, and image dimensions
  • Personal or shared folders for users
  • Permissions per directory
  • Ftp-like directory navigation
  • File sorting by name, size, dimensions, date
  • Tabbed interface for file operations
  • Keyboard shortcuts(up, down, insert(or enter), delete, home, end, ctrl+A, R(esize), T(humbnails), U(pload)).
  • Built-in support for inline image/file insertion into textareas
  • Multiple file selection(using ctrl or shift)
  • Ajax file operations
  • Themable layout using tpl files

Steps to integrates with ckeditor

Steps to IMCE integration with CKEDITOR

1. Download the CKeditor module from and imce module from .
2. Unzip the files in the sites/all/modules directory .
3. Download CKEditor from Unzip the contents of the ckeditor directory in the sites/all/modules/ckeditor/ckeditor directory.
4. Enable the modules as usual from Drupal’s admin pages.
5. Grant permissions for use of CKEditor in “Administer > User Management > Permissions”
6. Under “Administer > Site configuration > CKEditor”, adjust the ckeditor profiles. In each profile you can choose which textareas will be replaced by CKEditor, select default toolbar and configure some more advanced settings.
7. Go to and download CKfinder.
8. Extract the downloaded file ckfinder and put it in Ckeditor folder (sites/all/modules/ckeditor/ckfinder) .
9. Open config.php in the ckfinder folder and comment out the CheckAuthentication() function.

10. Add this code :
require_once ‘../../../../includes/filemanager.config.php’;

straight below the following line:
$baseUrl = ‘/ckfinder/userfiles/’;

11. Locate file named settings.php inside your drupal directory (usually sites/default/settings.php) and set $cookie_domain variable to your domain name.

12. In the administer->site configuration ->ckeditor, edit the profile you are using.
In the file browser setting:

  • Select CKFinder from the dropdown in File browser type (Link dialog).
  • Select IMCE from the dropdown in File browser type (Image dialog).
  • Select IMCE from the dropdown in File browser type (Flash dialog).
  • Save the configuration.

13. Go to create content ->page, try to upload a image using the ckeditor, it should work.

If you like FreeWebMentor and you would like to contribute, you can write an article and mail your article to [email protected] Your article will appear on the FreeWebMentor main page and help other developers.

Recommended Posts:

Article Tags: ,