How to Add and Upload an Image using CKEditor

How to Upload Image using CKEditor OR How to enable image upload option in Ckeditor

Step 1 : Download CKEditor Version 4.0.1 standard

Step 2 : open ckeditor\config.js

Step 3 : Add this line  after Line No : 27
                   config.filebrowserUploadUrl = '../ckupload.php';

Step 4 : Create ckupload.php file  ( ckeditor\ckupload.php )
           
             ckupload.php file code            
           
<?php
$url = 'images/uploads/'.time()."_".$_FILES['upload']['name'];
    if (($_FILES['upload'] == "none") OR (empty($_FILES['upload']['name'])) )
    {
       $message = "No file uploaded.";
    }
    else if ($_FILES['upload']["size"] == 0)
    {
       $message = "The file is of zero length.";
    }
    else if (($_FILES['upload']["type"] != "image/pjpeg") AND ($_FILES['upload']["type"] != "image/jpeg") AND ($_FILES['upload']["type"] != "image/png"))
    {
       $message = "The image must be in either JPG or PNG format. Please upload a JPG or PNG instead.";
    }
    else if (!is_uploaded_file($_FILES['upload']["tmp_name"]))
    {
       $message = "You may be attempting to hack our server. We're on to you; expect a knock on the door sometime soon.";
    }
    else {
      $message = "";
      $move = @ move_uploaded_file($_FILES['upload']['tmp_name'], $url);
      if(!$move)
      {
         $message = "Error moving uploaded file. Check the script is granted Read/Write/Modify permissions.";
      }
      $url = "../" . $url;
    }

$funcNum = $_GET['CKEditorFuncNum'] ;
echo "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($funcNum, '$url', '$message');</script>";
?>

Step 5 : Create Folder in ckeditor\
                       Folder Name :-  images\uploads

Step 6 : Run your page in php 
                 
               EX: (http://localhost/ckeditor/samples/replacebyclass.php) 
                                            OR
               EX: (http://localhost/ckeditor/samples/replacebyclass.html)