Yii中ckediter進一步配置

廢話篇：由於本人沒有安裝錄製桌面視頻的軟件，所以只能採用這種doc文檔的方式。

Boylee呢已給大家在視頻中講了ckeditor的使用，非常感謝boylee 我連夜從yiiblog下載玩視頻通宵看完。收穫頗多。也是自己以後對自己複習ckeditor的使用有個文檔依據寫這個教程好了廢話不多說了進入 正題。

  關於ckeditor 的工具欄是可以實現定製的。Yii 的擴展extension中的ckeditor的toolbar也是可以實現定製的。下面就從boylee 的視頻結束講解，視頻下載可以從網站yiiblog中下載地址: http://yiiblog.info/blog/yii-go/ 下載視頻教程3_5_3_extension_ckedit.mov還有editor擴展包CKediter- http://u.115.com/file/dnsrnmom

    當然網站內還有很多視頻教程。希望大家多學習。再次感謝boylee ，     

下面如果您還不瞭解如何在yii中使用ckeditor 那麼請認真的看一下boylee的視頻教程。

在yii官方網站的extension 下載裏面也能搜到ckeditor 但是沒有下載文件包。

 

在yii 的extensions裏面安裝好並按照boylee的視頻完成後。下面我們就要講解一下 工具欄的自定義了。

 

找到 剛剛安裝的extensions 裏面editor/Ckkceditor.php文件。

你會發現變量$toolbarset已經聲明；

而且如果你已經在你的Post頁面安裝了並調試好了ckeditor 你會發現和次代碼非常類似

那麼在你顯示錶單的頁面你會看到和次斷代碼類似的代碼

<?php $this->widget('application.extensions.editor.CKkceditor',array(

                    "model"=>$model,

                           "attribute"=>'content',         # Attribute in the Data-Model

                     "height"=>'400px',

                           "width"=>'100%',

                           "filespath"=>Yii::app()->basePath."/../upload/",

                    "filesurl"=>Yii::app()->baseUrl."/upload/",

            ) ); ?>

 

添加一條配置給$toolbar設置值 如下：

<?php $this->widget('application.extensions.editor.CKkceditor',array(

                    "model"=>$model,

                          "attribute"=>'content',         # Attribute in the Data-Model

                    "height"=>'400px',

                          "width"=>'100%',

                          "toolbarSet"=>array(

                              array( 'Source', '-', 'Bold','Italic', 'Underline', 'Strike' ),

                               array( 'Image', 'Link','Unlink', 'Anchor' ) ),

                                                                

                

                     "filespath"=>Yii::app()->basePath."/../upload/",

                    "filesurl"=>Yii::app()->baseUrl."/upload/",

            ) ); ?>

 

其中紅色的部分就是我們要對ckeditor配置的自定義工具欄配置表單ckeditor 是按區域顯示的所以 每個區域又是一個數組 同樣也可以使用  '-'  這個分隔區域

 

然後 打開這個文件extensions 裏面editor/Ckkceditor.php文件

 

我們要添加一些語句 找到如下語句：

$oCKeditor->basePath =$this->baseurl."/ckeditor/";

    $oCKeditor->config['height'] =$this->height;

    $oCKeditor->config['width'] =$this->width;

if (isset($this->config) &&is_array($this->config))

修改成如下語句：

 

$oCKeditor->basePath =$this->baseurl."/ckeditor/";

    $oCKeditor->config['height'] =$this->height;

    $oCKeditor->config['width'] =$this->width;

    // 判斷$toolbarSet是否配置 如配置並將值賦值給$this->config[‘toolbar’];

    if(isset($this->toolbarSet) &&is_array($this->toolbarSet))

    {

          $this->config['toolbar'] = $this->toolbarSet;

    }

    if (isset($this->config) &&is_array($this->config))

    {

      foreach ($this->config as$key=>$value)

      {

        $oCKeditor->config[$key] = $value;

      }

    }

添加了上面的藍色的語句判斷一下

這樣配置在頁面顯示的工具如下

如需更多的配置選項請參考一下配置字段：

['Source','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print','SpellChecker', 'Scayt'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form', 'Checkbox', 'Radio', 'TextField','Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
'/',
['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
'/',
['Styles','Format','Font','FontSize'],
['TextColor','BGColor']
];

 

具體的字段呢 大家可以拿來試一下。Ok 寫完了

=_= 困了 誰家了

By CodyHuny 2011-7-29 03:11