CKEditor CKFinder Integration using PHP

You may have found it quite difficult to integrate CKEditor with CKFinder. But this tutorial will make your job very simple.

Here provided two options either to download integrated files [link] and use it in xampp(or any such server) or download CKEditor (download) and CKFinder (download) by yourself and follow the steps given.

Way 1. You can download the integrated code from https://github.com/gdbhosale88/ckeditor-ckfinder-integration and put inside htdocs/ckeditor-ckfinder-integration and open url http://localhost/ckeditor-ckfinder-integration [Make sure that folder structure is similar to one which is given below].

Way 2. Follow the steps below for Integration.

1. Download CKEditor (download) and CKFinder (download).
2. Put extracted code of both folder’s in one folder ckeditor-ckfinder-integration inside htdocs as per structure below.
3. Create index file (index.html) which will be containing the editor as below code.

so your folder structure will be something like this:

4. Now open file config.php inside ckfinder & make following changes:

5. Now open url http://localhost/ckeditor-ckfinder-integration and try uploading image.

ckeditor

And that’s it, we’ve are done with all settings that works fine. Hope you like it! Like our FB page to stay tuned… www.facebook.com/DwijAFreeSourceBird

Ganesh Bhosale

From a laptop to a full organization, Ganesh has traveled a tough road. A commando, armed with the latest tech & a huge warehouse of knowledge, he leads by example & is here for the long haul. His strong belief in giving back more has borne rich fruits, both for his employees & clients.

You may also like...

9 Responses

  1. Dev says:

    Thanks For this. when i will upload it on server then what will be the path of the image upload from the client system to server on its domain in the following code.
    function CheckAuthentication() {
    return true;
    }
    $baseUrl = ‘http://localhost/ckeditor-ckfinder-integration/uploads/’;
    $enabled = true;
    $config[‘SecureImageUploads’] = false;
    $config[‘ChmodFolders’] = 0777 ;

  2. Manimarna says:

    Thanks for this tutorials it had worked

  3. kosal says:

    Oh Man… your work is a God’s work. Thank you so much. You save my life.

  4. Ravi says:

    Hii…Ganesh Sir,

    Could you please tell me the expiry duration???

  5. Swapnil K says:

    Thanks for this script…….

  6. ihshancs says:

    Wove! Nice Editor, Easy to store database . first of i am not satisfied and confused. I cant store more than 3 line in a DB. how can i write text and add image more than 3 line and store a database.
    Hehe After that i am increased size of varchar.
    —————–Thanks———————

  7. ihshancs says:

    How to reduce editor width..? where is file location for change editor width (eg: i need width:auto 0; )…?
    I think this editor cannot work good without using internet…

  8. Bella Beck says:

    Thanks a Lot!! 😀

Leave a Reply

Your email address will not be published. Required fields are marked *