淺析Yii2整合富文字編輯器redactor執行個體教程_php執行個體

來源:互聯網
上載者:User

在上篇文章給大家介紹了如何在yii2中整合百度編輯器umeditor以及如何解決umeditor上傳圖片問題。

今天我們來談談yii2整合另外一個強大好用的富文字編輯器Redactor,個人覺得Redactor比百度編輯器好用哦

Redactor有官方的Yii2外掛程式package,實用性也是很強的。

首先我們不急不躁,先進行安裝Redactor。

可以參考https://github.com/yiidoc/yii2-redactor進行安裝。有很多新手看不慣英文哈,如果你點擊了連結參考了github上的安裝,希望你再回來看看在整個安裝過程中都要哪些必要的注意點。

1、我們跟他們一樣,利用composer安裝即可。

2、添加配置項

'modules' => [ 'redactor' => [ 'class' => 'yii\redactor\RedactorModule', 'uploadDir' => '上傳目錄', 'uploadUrl' => '圖片可訪問地址', 'imageAllowExtensions'=>['jpg','png','gif'] ], ],

第一個注意點,預設的上傳檔案儲存在根目錄下的uploads,如果你想更換檔案的儲存目錄,修改配置項uploadDir即可,同時你需要修改uploadUrl保證圖片可訪問。3、如果你的view是ActiveField類型,下面的配置適用你

<?= $form->field($model, 'content')->widget(\yii\redactor\widgets\Redactor::className()) ?>

但是如果你的表單不是用yii內建的組建產生的,你應該像下面這樣配置

<?= \yii\redactor\widgets\Redactor::widget([ 'model' => $model, 'attribute' => 'content' ]) ?>

4、其中上傳類用的是redactor一套,但是你說你的上傳類需要重寫,也可以,只需要像下面這樣加幾個配置即可

<?= $form->field($model, 'content')->widget(\yii\redactor\widgets\Redactor::className(), [ 'clientOptions' => [ 'imageManagerJson' => ['/redactor/upload/image-json'], 'imageUpload' => ['/redactor/upload/image'], 'fileUpload' => ['/redactor/upload/file'], 'lang' => 'zh_cn', 'plugins' => ['clips', 'fontcolor','imagemanager'] ] ]) ?>

5、配置語言或者外掛程式,像第四步一樣,在clientOptions項中添加lang和plugins配置項即可,如果你想問都有哪些plugins,開啟目錄\vendor\yii2-redactor\assets\plugins可以一睹風采。

6、圖片上傳注意了,因為redactor是以模組進行引入的,如果你的項目含有許可權管理,記得添加許可權哦。

7、忘記了一個大前提,保證你的php支援fileinfo擴充。開啟php.ini檔案去掉fileinfo前面的分號即可

以上所述是小編給大家介紹的Yii2整合富文字編輯器redactor執行個體教程,希望對大家有所協助!

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.