README

Imperavi Redactor Widget 是 Imperavi Redactor 10.2.5 的包装器，一个高质量的所见即所得编辑器。

请注意，Imperavi Redactor 本身是专有商业版权软件，但由于 Yii 社区购买了 OEM 许可证，您可以在 Yii 中免费使用。

安装

安装此扩展的首选方式是通过 composer。

运行以下命令：

$ php composer.phar require --prefer-dist davidxu/yii2-imperavi-widget "*"

或添加以下内容到您的 composer.json 文件的 require 部分：

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

使用方法

如果文件/图片信息存储在数据库中或使用七牛存储桶，请首先实施以下迁移

yii migrate/up --migration-path @davidxu/imperavi/migrations/

一旦扩展被安装，只需在您的代码中简单使用它即可

像小部件一样

echo \davidxu\imperavi\Redactor::widget([
    'name' => 'redactor',
    'settings' => [
        'lang' => 'zh_cn',
        'imageUpload' => '/api/v1/redactor/upload',
        '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 davidxu\imperavi\Redactor;

echo $form->field($model, 'content')->widget(Redactor::class, [
    'settings' => [
        'lang' => 'zh_cn',
        'imageUpload' => '/api/v1/redactor/upload',
        '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>'],
        ],
    ],
]);

像预定义 textarea 的小部件一样

echo \davidxu\imperavi\Redactor::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'zh_cn',
        'imageUpload' => '/api/v1/redactor/upload',
        '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>'],
        ],
    ],
]);

上传图片

// DefaultController.php
public function actions()
{
    return [
        'upload-local' => [
            'class' => 'davidxu\imperavi\actions\LocalUploadFileAction',
            'dnsBaseUrl' => 'http://my-site.com/', // Domain name or uri where files are stored, filelink will be dnsBaseUrl + url 
            'url' => 'images/', // Directory URL address, where files are stored.
            'path' => '@alias/to/my/path', // Or absolute path to directory where files are stored.
            'modelClass' => Attachment::class, // Please use migration first, if file/image info stored in DB
            'storeInDB' => true, // Default true
        ],
        'upload-qiniu' => [
            'class' => 'davidxu\imperavi\actions\QiniuUploadFileAction',
            'dnsBaseUrl' => 'http://my-site.com/', // Qiniu DNS domain name, filelink will be dnsBaseUrl + url 
            'url' => 'images/', // Qiniu key prefix, key will be url + filename.
            'modelClass' => Attachment::class, // Please use migration first
        ],
    ];
}

// View.php
echo \davidxu\imperavi\Redactor::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'zh_cn',
        'minHeight' => 200,
        'imageUpload' => Url::to(['/default/image-upload']),
        'plugins' => [
            'imagemanager',
        ],
    ],
]);

添加自定义插件

echo \davidxu\imperavi\Redactor::widget([
    'selector' => '#my-textarea-id',
    'settings' => [
        'lang' => 'zh_cn',
        'minHeight' => 200,
        'plugins' => [
            'clips',
            'fullscreen'
        ]
    ],
    'plugins' => [
        'my-custom-plugin' => 'app\assets\MyPluginBundle',
    ],
]);

测试

$ phpunit

更多信息

请查看 Imperavi Redactor v10 文档以获取有关其配置选项的更多信息。

贡献

请查看 CONTRIBUTING 以获取详细信息。

鸣谢

• Vasile Crudu
• David Xu
• 所有贡献者

许可

BSD 许可证 (BSD)。请参阅 许可文件 了解更多信息。

升级指南

请查看 UPGRADE GUIDE 了解详细信息。