Imperavi Redactor Widget for Yii 2 开源项目最佳实践

Imperavi Redactor Widget for Yii 2 开源项目最佳实践

yii2-imperavi-widget Imperavi Redactor widget for Yii 2 项目地址: https://gitcode.com/gh_mirrors/yi/yii2-imperavi-widget

1、项目介绍

Imperavi Redactor Widget 是一个为 Yii 2 框架设计的 WYSIWYG 编辑器组件。它封装了 Imperavi Redactor 10.2.5，这是一个高质量的所见即所得编辑器。尽管 Imperavi Redactor 本身是一个商业软件，但由于 Yii 社区购买了 OEM 许可证，因此你可以免费与 Yii 一同使用。

2、项目快速启动

安装

推荐使用 Composer 安装此扩展。你可以通过以下命令安装：

$ php composer.phar require --prefer-dist vova07/yii2-imperavi-widget

或者，你可以在 composer.json 文件的 require 部分添加：

"vova07/yii2-imperavi-widget": "*"

使用

一旦扩展安装完成，你就可以在你的代码中像使用普通小部件一样使用它：

echo \vova07\imperavi\Widget::widget([
    'name' => 'redactor',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'plugins' => ['clips', 'fullscreen'],
        'clips' => [
            ['Lorem ipsum...', 'Lorem...'],
            ['red', '<span class="label-red">red</span>'],
            ['green', '<span class="label-green">green</span>'],
            ['blue', '<span class="label-blue">blue</span>'],
        ],
    ],
]);

你也可以在 ActiveForm 中使用它：

use \vova07\imperavi\Widget;

echo $form->field($model, 'content')->widget(Widget::className(), [
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'plugins' => ['clips', 'fullscreen'],
        'clips' => [
            ['Lorem ipsum...', 'Lorem...'],
            ['red', '<span class="label-red">red</span>'],
            ['green', '<span class="label-green">green</span>'],
            ['blue', '<span class="label-blue">blue</span>'],
        ],
    ],
]);

3、应用案例和最佳实践

添加已上传的图片

在 DefaultController.php 中定义获取图片的动作：

public function actions()
{
    return [
        'images-get' => [
            'class' => 'vova07\imperavi\actions\GetImagesAction',
            'url' => 'http://my-site.com/images/',
            'path' => '@alias/to/my/path',
            'options' => [
                'only' => ['*.jpg', '*.jpeg', '*.png', '*.gif', '*.ico'],
            ],
        ],
    ];
}

在视图文件中添加图片上传和管理的配置：

echo \vova07\imperavi\Widget::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'imageUpload' => Url::to(['default/image-upload']),
        'imageManagerJson' => Url::to(['default/images-get']),
        'plugins' => ['imagemanager'],
    ],
]);

添加已上传的文件

在 DefaultController.php 中定义获取文件的动作：

public function actions()
{
    return [
        'files-get' => [
            'class' => 'vova07\imperavi\actions\GetFilesAction',
            'url' => 'http://my-site.com/files/',
            'path' => '@alias/to/my/path',
            'options' => [
                'only' => ['*.txt', '*.md'],
            ],
        ],
    ];
}

在视图文件中添加文件上传和管理的配置：

echo \vova07\imperavi\Widget::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'fileUpload' => Url::to(['default/file-upload']),
        'fileManagerJson' => Url::to(['default/files-get']),
        'plugins' => ['filemanager'],
    ],
]);

上传图片

在 DefaultController.php 中定义图片上传的动作：

public function actions()
{
    return [
        'image-upload' => [
            'class' => 'vova07\imperavi\actions\UploadFileAction',
            'url' => 'http://my-site.com/images/',
            'path' => '@alias/to/my/path',
        ],
    ];
}

在视图文件中添加图片上传的配置：

echo \vova07\imperavi\Widget::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'imageUpload' => Url::to(['default/image-upload']),
        'plugins' => ['imagemanager'],
    ],
]);

上传文件

在 DefaultController.php 中定义文件上传的动作：

public function actions()
{
    return [
        'file-upload' => [
            'class' => 'vova07\imperavi\actions\UploadFileAction',
            'url' => 'http://my-site.com/files/',
            'path' => '@alias/to/my/path',
            'uploadOnlyImage' => false,
        ],
    ];
}

在视图文件中添加文件上传的配置：

echo \vova07\imperavi\Widget::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'fileUpload' => Url::to(['default/file-upload']),
        'plugins' => ['filemanager'],
    ],
]);

替换同名文件

在 DefaultController.php 中定义文件上传的动作，允许替换同名文件：

public function actions()
{
    return [
        'file-upload' => [
            'class' => 'vova07\imperavi\actions\UploadFileAction',
            'url' => 'http://my-site.com/files/',
            'path' => '@alias/to/my/path',
            'uploadOnlyImage' => false,
            'unique' => false,
            'replace' => true,
        ],
    ];
}

在视图文件中添加文件上传的配置：

echo \vova07\imperavi\Widget::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'ru',
        'minHeight' => 200,
        'fileUpload' => Url::to(['default/file-upload']),
        'plugins' => ['filemanager'],
    ],
]);

4、典型生态项目

此项目主要是一个 Yii 2 框架的扩展，因此它的典型生态项目将与 Yii 2 框架的应用相关。它可以用于任何需要 WYSIWYG 编辑器的 Yii 2 项目，例如内容管理系统 (CMS)、博客平台、电子商务网站等。

以上是根据 Imperavi Redactor Widget for Yii 2 开源项目生成的教程，包含了项目介绍、项目快速启动、应用案例和最佳实践、典型生态项目等模块。希望对你有所帮助。

yii2-imperavi-widget Imperavi Redactor widget for Yii 2 项目地址: https://gitcode.com/gh_mirrors/yi/yii2-imperavi-widget