To integrate CKFinder with CKEditor, follow the steps give below:
Navigate to the official CKFinder website
Download and extract CKFinder.
After extracting CKFinder, place it in your project directory.
Include CKFinder's JavaScript file in your HTML, just as you did with CKEditor:
Ensure CKEditor is correctly initialized in your HTML file, with the proper ‘textarea’ element:
Use CKFinder's
CKFinder.setupCKEditor
method to integrate CKFinder with CKEditor:
Replace
path/to/ckfinder/
with the actual path to your CKFinder folder.
Configure CKFinder's config.php file (located in the CKFinder directory) to enable file uploading. Set the correct ‘baseUrl’ and ‘baseDir’ paths
Here’s the full example integrating CKFinder with CKEditor in your HTML:
Open your HTML file in a browser. You should be able to use CKFinder for file uploads and image management directly within CKEditor.