How to setup FCK editor in Yii?

I'm new to Yii framework, I need an FCK editor for my CMS management page. I downloaded and extracted the FCKeditor to the root folder and its extension in yii extension folder. and i added the following code in my view

<?php $this->widget('application.extensions.fckeditor.FCKEditorWidget',array(
    "model"=>$model,                # Data-Model
    "attribute"=>'content',         # Attribute in the Data-Model
    "height"=>'400px',
    "width"=>'100%',
    "toolbarSet"=>'Basic',          # EXISTING(!) Toolbar (see: fckeditor.js)
    "fckeditor"=>Yii::app()->basePath."/../fckeditor/fckeditor.php",
                                    # Path to fckeditor.php
    "fckBasePath"=>Yii::app()->baseUrl."/fckeditor/",
                                    # Realtive Path to the Editor (from Web-Root)
    "config" => array(
        "EditorAreaCSS"=>Yii::app()->baseUrl.'/css/index.css',),
                                    # http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Configuration/Configuration_Options
                                    # Additional Parameter (Can't configure a Toolbar dynamicly)
    ) ); ?>

These all are working fine. but the editor is displayed separatly. i need the editor in place of content textarea.

<?php echo CHtml::activeTextArea($model,'content',array('rows'=>6, 'cols'=>50)); ?>

To use FCKEditor instead of the above textarea, invoke the integration widget by replacing above code with following:

<?php $this->widget('application.extensions.fckeditor.FCKEditorWidget',array(
 'model'     =>  $model,
 'attribute' => 'content',
 'height'    =>  '600px',
 'width'     =>  '100%',
 'fckeditor' =>  dirname(Yii::app()->basePath).'/htdocs/fckeditor/fckeditor.php',
 'fckBasePath' => Yii::app()->baseUrl.'/fckeditor/')
 ); ?>

If you did it in this way, then the textarea will be replaced with editor.