maxwen / yii2-ckeditor-widget
为yii2框架提供的ckeditor小部件,集成了ckfinder
1.0.9
2017-03-28 03:12 UTC
Requires
- bower-asset/jquery-cookie: ~1.4.1
- yiisoft/yii2: ~2.0.0
Requires (Dev)
- ckeditor/ckeditor: dev-full/4.6.x
Suggests
- studio-42/elfinder: open source web file manager.
README
为yii2提供的CKEditor小部件,支持ckfinder和elfinder
此仓库是从2amigos/yii2-ckeditor-widget分叉而来。
我进行了一些定制。
安装
composer require maxwen/yii2-ckeditor-widget
配置
为了添加自定义配置,
您需要将 controllerMap 添加到您的 config/main.php 配置文件中。
'controllerMap' => [
'ckeditor' => [
'class' => 'maxwen\ckeditor\controllers\EditorController',
'viewPath' => '@vendor/maxwen/yii2-ckeditor-widget/views/editor'
]
]
然后将自定义配置添加到 params.php 中:请参阅 CKEditor.config
// CKEditor config rewrite
'ckeditorConfig' => [
// custom options
'language' => 'en',
'font_names' => 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana',
'toolbar' => 'Full',
'skin' => 'your skin name here'
// etc...
],
用法
该库包含两个小部件:CKEditor
和CKEditorInline
。一个用于经典编辑,另一个用于内联编辑。
使用基本预设的模型
use maxwen\ckeditor\CKEditor;
<?= $form->field($model, 'text')->widget(CKEditor::className(), [
'options' => ['rows' => 6],
'editorConfig' => [
'customConfig' => 'http://yourdoman.com/ckeditor/config.js',
// etc ...
]
]) ?>
使用基本预设的内联编辑
use maxwen\ckeditor\CKEditorInline;
<?php CKEditorInline::begin([
'editorConfig' => [
// ...
]
]);?>
This text can be edited now :)
<?php CKEditorInline::end();?>
如何添加自定义插件
这是向编辑器添加自定义插件的方法。由于版本2.0,我们正在使用CKEditor库的packagist版本,因此我们需要使用其配置API来添加外部插件。
以添加流行的Code Editor Plugin插件为例。此插件将允许我们在编辑器的工具栏中添加按钮,以便将代码添加到我们正在编辑的内容中。
假设您已下载插件并将其添加到Yii2站点的根目录。我的设置如下
+ frontend + -- web + -- pbckcode
现在我们可以将其添加到我们的CKEditor小部件中。在此示例中,我使用的是CKEditorInline
小部件。您在此示例中注意到的第一点是我们没有使用预设属性;这非常重要,因为我们希望向小部件添加自定义工具栏。不多说,下面是代码
<?php use maxwen\ckeditor\CKEditorInline; // First we need to tell CKEDITOR variable where is our external plufin $this->registerJs("CKEDITOR.plugins.addExternal('pbckcode', '/pbckcode/plugin.js', '');"); // ... // Using the plugin <?php CKEditorInline::begin(['preset' => 'custom', 'clientOptions' => [ 'extraPlugins' => 'pbckcode', 'toolbarGroups' => [ ['name' => 'undo'], ['name' => 'basicstyles', 'groups' => ['basicstyles', 'cleanup']], ['name' => 'colors'], ['name' => 'links', 'groups' => ['links', 'insert']], ['name' => 'others', 'groups' => ['others', 'about']], ['name' => 'pbckcode'] // <--- OUR NEW PLUGIN YAY! ] ]]) ?> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <?php CKEditorInline::end() ?>
关于CKFinder
CKFinder是一款商业软件,此仓库仅包含一个演示版本,您可以在此处购买完整版本。
更多信息
请查阅CKEditor插件网站的文档,以获取有关其配置选项的更多信息。