CodeCharge Studio
search Register Login  

Web Reports

Visually create Web Reports in PHP, ASP, .NET, Java, Perl and ColdFusion.

YesSoftware Forums -> CodeCharge Studio -> Tips & Solutions

 CKEditor with CKfinder integration in CCS (PHP)

Print topic Send  topic

Author Message

Posts: 1
Posted: 11/21/2009, 4:45 AM

I spent a lot of time to work out how to use the new ckeditor in CCS, and I wish to give you the results. Excuse my bad English - it's not my native language.

First of all: Why should someone use the ckeditor?
The open-source fckeditor has reached the version no 3 and is now called CKeditor. The tool has several advantages to the prior version (faster, better looking, generally more up-to-date) BUT since it was programmed new it works in another way and cannot be integrated the same way.
A major difference is, that the fileconnector, that was part of the older version is now part of the sister-product ckfinder. While this product was a "nice to have" earlier it is an important part now for anyone wishing to upload files (being images or flash) into the text.
Therefore it is not only more complicate but there is the question of the licensing fees at well. This is as follows: The CKeditor itself is free under the GPL, LGPL and MPL licenses (the rest has to buy a license) so for the most purposes its free. The CKfinder alas is not free but costs 59$ per domain. BUT if you can live with the title above the thumbnail-screen, saying that it is in demo-mode it is free too - In my opinion the important thing is not the thumbs but the upload functionality...
There is a very nice done (and free) solution called Dynpage (to get and see with a demo at ) that shows the combination of the programs. Please note, that this is a file based solution without a database.

OK: Now, how to integrate it?
First you have to decide, if you NEED the fileupload in your textarea. The workaround differs for these cases.

First case: You don't need a fileupload:
This problem was solved from tomcatsolutions (thank you) in the thread "CKEditor instead of FCKEditor" in the "wishes" part of this forum. Here is the solution again:
1. Upload a copy of CKeditor to the root of your domain (i.e.
2. Put this script in your <head>
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
3. After your<textarea> put this script
<script type="text/javascript"> CKEDITOR.replace('{TextArea1_Name}'); </script>
Note: Where {TextArea1_Name} is the CodeCharge variable expression for your text area.

Second case: You need files (e.g. pictures) in your textarea
1. Upload a copy of CKeditor to the root of your domain (i.e.
2. Upload a copy of CKfinder to the root of your domain (i.e.
3. Since you allow a not further restricted fileupload you have to make sure, that no one but a authenticated user
can upload the files. Therefore you MUST protect your sites made in CodeChargeStudio. Furhermore you
have to make sure, that the function can not be abused by someone who uses the ckfinder directly. I suggest
a simple test for the session-ID given by CCS. To implement this you fill in the config.php-file of the ckfinder the
following lines in the function CheckAuthentication():
return true;
return false;
4. You have to provide a space where to load your files on your webserver. By the (f)ckeditor this is a directory
called "UserFiles" by default.
I will assume that you have a directory UserFiles in the root with the subdirectories image, flash, media and file.
This may vary a bit with your version of the program. e.g. is "userfiles" or "images" often used too. You may have
to make a little bit of editing in the config.php file of both programs. Make sure, that the entry in the config.php of
the ckfinder points to the right directory, e.g.
$baseUrl = '/UserFiles/';
5. Of course, if you HAVE a license fill in these informations as well.
6. If you haven't t done it already make your UserFiles-directory (and below) usable. Set the CHMOD=777 or so...
7. Now (finally) you can work with CCS:
- Make a record-form in restricted page
- Fill in the head:
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="/ckfinder/ckfinder.js"></script>
- After your<textarea> put this script:
<script type="text/javascript">
var editor = CKEDITOR.replace( '{TextArea1_Name}' );
CKFinder.SetupCKEditor( editor, '/ckfinder/' ) ;
Note: Where {TextArea1_Name} is the CodeCharge variable expression for your text area.

Good luck
View profile  Send private message

Posts: 868
Posted: 01/03/2010, 4:40 PM

Hi.. thanks for this. Then New CKEDITOR is great!

I had to change the class of the TextArea to' ckeditor ' in order to get it to work.

Walter are dearly missed.
View profile  Send private message

Posts: 128
Posted: 01/05/2010, 3:24 PM

ckeditor is a great product, i'm using it and the only problem is not always work fine in Internet Explorer, but for me is not a big deal.

Due the licence cost of ckfinder I make my own filebrowser that connect to ckeditor, developed in CCS so you can customize the aspect, if some need the code I dont have problem giving for free.

I don't need to change the class as say ckroon, I olny add a few lines of javascript under the textarea and I even can select different skins/toolbar in the same page.

In few words is a great software!


Carlos Leyan
Temuco, Chile

Carlos Leyan B.
Temuco, Chile
View profile  Send private message

Add new topic Subscribe to topic   

These are Community Forums for users to exchange information.
If you would like to obtain technical product help please visit

Internet Database

Visually create Web enabled database applications in minutes.

Home   |    Search   |    Members   |    Register   |    Login

Powered by UltraApps Forum created with CodeCharge Studio
Copyright 2003-2004 by  and YesSoftware, Inc.