maxwen/yii2-ckeditor-widget

为yii2框架提供的ckeditor小部件,集成了ckfinder

安装次数: 424

依赖: 0

建议者: 0

安全: 0

星标: 4

关注者: 3

分支: 0

语言:JavaScript

类型:扩展

1.0.9 2017-03-28 03:12 UTC

This package is not auto-updated.

Last update: 2024-09-14 19:20:18 UTC


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...
	],
	

用法

该库包含两个小部件:CKEditorCKEditorInline。一个用于经典编辑,另一个用于内联编辑。

使用基本预设的模型


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插件网站的文档,以获取有关其配置选项的更多信息。