[SOLVED] How can I use Ckfinder with Ckeditor?

How can I use Ckfinder with Ckeditor?

I was used Ckeditor in my project. It was worked well. I can put picture in texts but with an url. I know that,if I want upload an picture from my pc, I must used CKfinder. How can I use Ckfinder with Ckeditor?

I use this code to call CKeditor:

 protected void Page_Load(object sender, EventArgs e)
{
    String StrScript = "CKEDITOR.replace( '" + TextBox1.ClientID + "',{toolbar : 'Full'});";
    ClientScript.RegisterStartupScript(this.GetType(), "Ck-Js/ckeditor", StrScript, true);

}

Thanks.

Solution

it takes nearly 5 minutes to complete setup:

Download CKEditor and CKFinder.
Put extracted code of both in one folder inside xampp as below.

Create index file (index.html) which will be containing the editor as below code.

<html>
<head>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckfinder/ckfinder.js"></script>
</head>
<body>
    <h1>CKEditor CKFinder Integration using PHP</h1>
    <textarea id="editor1" name="editor1" rows="10" cols="80"></textarea>
<script type="text/javascript">
var editor = CKEDITOR.replace( 'editor1', {
    filebrowserBrowseUrl : 'ckfinder/ckfinder.html',
    filebrowserImageBrowseUrl : 'ckfinder/ckfinder.html?type=Images',
    filebrowserFlashBrowseUrl : 'ckfinder/ckfinder.html?type=Flash',
    filebrowserUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
    filebrowserImageUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
    filebrowserFlashUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
});
CKFinder.setupCKEditor( editor, '../' );
</script>
</body>
</html>

so your folder structure will be something like this:

htdocs
|_integrated
    |_ckeditor
    |   |_config.js
    |   |_...
    |_ckfinder
    |   |_config.php
    |   |_...
    |_uploads
    |_index.html

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

function CheckAuthentication() {
    return true;
}
$baseUrl = 'http://localhost/integrated/uploads/';
$enabled = true;
$config['SecureImageUploads'] = false;
$config['ChmodFolders'] = 0777 ;

Now open url http://localhost/integrated/ and try uploading image.