fakis/yii2-ueditor

富文本编辑器，针对Yii2框架封装的百度UEditor编辑器

1.0.3 2024-01-09 02:48 UTC

Requires

• php: >=7.2
• symfony/uid: ^5.2
• yiisoft/yii2: ~2.0.14

BSD-3-Clause

• Fakis

• extension
• yii2
• ueditor

README

富文本编辑器，针对Yii2框架封装的百度UEditor富文本编辑器

构建于UEditor 版本ueditor1_4_3_3-utf8-php.zip

• Releases
• Github
• 官方文档

安装

通过 composer 安装此扩展

php composer.phar require --prefer-dist fakis/yii2-ueditor "*"

或者在composer.json文件的require部分填上

"fakis/yii2-ueditor": "*"

使用

语言

ueditor只支持2种语言，en-us和zh-cn,默认跟随系统语言 Yii::$app->language,可以通过2种方式设置

1. 修改系统语言，在配置文件里添加'language' => 'zh-CN',。
2. 实例化的时候配置语言选项

配置相关

编辑器相关配置，请在view 中配置，参数为clientOptions，比如定制菜单，编辑器大小等等，具体参数请查看UEditor官网文档。

\fakis\ueditor\UEditor::widget([
	// 您可以将它用于模型属性
	'model' => $model,
	'attribute' => 'field',

	// 或者仅用于字段
	'name' => 'input_name',
	
	// 客户端配置
    'clientOptions' => [
        //编辑区域大小
        'initialFrameHeight' => '200',
        //设置语言
        'lang' =>'en', //中文为 zh-cn
        //定制菜单
        'toolbars' => [
            [
                'fullscreen', 'source', 'undo', 'redo', '|',
                'fontsize', 'bold', 'italic', 'underline', 'fontborder', 'strikethrough', '|',
                'forecolor', 'backcolor', '|',
                'justifyleft', 'justifycenter', 'justifyright', '|',
                'lineheight', 'indent', '|',
                'link', 'unlink', '|', 'searchreplace',
                'removeformat', 'formatmatch', '|',
                'insertimage'
            ],
        ]
    ]
]);

或者

$form = \yii\widgets\ActiveForm::begin();

echo $form->field($model, 'field')->widget('\fakis\ueditor\UEditor', [
	// 客户端配置
    'clientOptions' => [
        //编辑区域大小
        'initialFrameHeight' => '200',
        //设置语言
        'lang' =>'en', //中文为 zh-cn
        //定制菜单
        'toolbars' => [
            [
                'fullscreen', 'source', 'undo', 'redo', '|',
                'fontsize', 'bold', 'italic', 'underline', 'fontborder', 'strikethrough', '|',
                'forecolor', 'backcolor', '|',
                'justifyleft', 'justifycenter', 'justifyright', '|',
                'lineheight', 'indent', '|',
                'link', 'unlink', '|', 'searchreplace',
                'removeformat', 'formatmatch', '|',
                'insertimage'
            ],
        ]
    ]
]);

\yii\widgets\ActiveForm::end();

文件上传接口

文件上传相关配置，请在controller中配置，参数为config,例如文件上传路径等；更多参数请参照 config.php (跟UEditor提供的config.json一样)

public function actions()
{
    return [
        'upload' => [
            'class' => 'fakis\ueditor\UEditorAction',
            'config' => [
                "imageUrlPrefix"  => "http://www.your-domain.com", // 图片访问路径前缀
                "imagePathFormat" => "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}" // 上传保存路径
                "imageRoot" => Yii::getAlias("@webroot"),
            ],
        ]
    ];
}

文件上传七牛接口

public function actions()
{
    return [
        'upload' => [
            'class' => 'fakis\ueditor\UEditorAction',
            'config' => [
                'imageUrl' => 'http://up-z2.qiniup.com/', // 七牛区域上传接口域名
                'imageUrlPrefix' => 'http://www.your-domain.com/', // 图片访问路径前缀
                "imagePathFormat" => "/upload/image/{yyyy}{mm}/{uuid}" // 上传保存路径
                'imageFieldName' => 'file', // 上传控件名
            ],
        ]
    ];
}