Yii框架扩展：KEditor——完美整合Yii框架和KindEditor的可视化编辑器

程序猿

最近业余时间在用Yii框架做一个内容采集及分发平台，这里面自然涉及到文章内容采集和发布，一般采集软件从采集到发布一站式解决，但是既然做了自己用，有时候还是要保证文章质量的，所以在采集和发布之间，我想做一个中间层，对文章内容进行优化和处理，那么这里就要用到可视化编辑器对文章内容进行编辑，国外比较流行的可视化编辑器主要有CKEditor和TinyMCE（wordpress即是采用这款编辑器），但是它们有个缺点就是图片上传处理及浏览是要收费的，所以转向国内，国内的话主要就是KindEditor和百度编辑器UEditor，之前用过百度编辑器（参阅百度编辑器整合Yii框架），这次准备玩玩KindEditor，按照文档（参阅kindeditor编辑器使用方法）去整合进来固然可以，但是扩展性不好，不如直接自己基于KindEditor写个扩展。
在Yii框架中，写个这种扩展比较简单，下面就扩展的编写和使用方法做个简单说明：
1.下载kindeditor（下载地址：http://pan.baidu.com/s/1pJsIth5），并解压到Yii框架的protected/extensions目录下，比如我的路径是protected/extensions/kindeditor。
2.在kindeditor目录创建一个php类文件KEditorWidget.php，内容如下：
widget('ext.kindeditor.KEditorWidget',array( * 'id'=>'Item_content', # Textarea id * )); ?> */ class KEditorWidget extends CInputWidget { public $id; public $language = 'zh_CN'; public $paramOptiOns= '{}'; /** * 初始化组件. */ public function init() { // 阻止从命令行执行. if (Yii::app() instanceof CConsoleApplication) return; /** @var CClientScript $cs */ $cs = Yii::app()->getClientScript(); $cs->registerScriptFile($this->assetsUrl.'/kindeditor-min.js', CClientScript::POS_HEAD); } /** * 运行组件. */ public function run() { $script = "KindEditor.ready(function(K){window.editor=K.create('#".$this->id."',".$this->paramOptions.");});"; /** @var CClientScript $cs */ $cs = Yii::app()->getClientScript(); $cs->registerScript($this->id, $script, CClientScript::POS_HEAD); $cs->registerScriptFile($this->assetsUrl.'/lang/'.$this->language.'.js', CClientScript::POS_HEAD); } public function getAssetsUrl() { $assetsPath = Yii::getPathOfAlias('ext.kindeditor'); $assetsUrl = Yii::app()->assetManager->publish($assetsPath, false, -1, YII_DEBUG); return $assetsUrl; } } ?> 3.接下来就是使用该组件在_form.php文件中显示出kindeditor的编辑器界面了，这也比较简单：
1）简单调用：
  labelEx($model,'content'); ?> textArea($model,'content',array('rows'=>6, 'cols'=>50)); ?> error($model,'content'); ?>