Home > Backend Development > PHP Tutorial > A brief analysis of the Yii2 integrated rich text editor redactor example tutorial, yii2redactor_PHP tutorial

A brief analysis of the Yii2 integrated rich text editor redactor example tutorial, yii2redactor_PHP tutorial

WBOY
Release: 2016-07-12 08:53:24
Original
1089 people have browsed it

A brief analysis of Yii2 integrated rich text editor redactor tutorial. In the previous article, yii2redactor

introduced to you how to integrate Baidu editor umeditor in yii2 and how to solve umeditor upload. Picture problem.

Today we will talk about yii2 integrating another powerful and easy-to-use rich text editor, Redactor. Personally, I think Redactor is easier to use than Baidu Editor

Redactor has an official Yii2 plug-in package, which is also very practical.

First of all, let’s not be impatient and install Redactor first.

You can refer to https://github.com/yiidoc/yii2-redactor for installation. There are many novices who cannot understand English. If you click on the link and refer to the installation on github, I hope you will come back to see what necessary precautions are required during the entire installation process.

1. Just like them, we can use composer to install it.

2. Add configuration items

'modules' => [ 
'redactor' => [ 
'class' => 'yii\redactor\RedactorModule', 
'uploadDir' => '上传目录', 
'uploadUrl' => '图片可访问地址', 
'imageAllowExtensions'=>['jpg','png','gif'] 
], 
],
Copy after login

The first point to note is that the default uploaded files are saved in the uploads directory in the root directory. If you want to change the file saving directory, just modify the configuration item uploadDir. At the same time, you need to modify the uploadUrl to ensure that the image is accessible. 3. If your view is of ActiveField type, the following configuration applies to you

<&#63;= $form->field($model, 'content')->widget(\yii\redactor\widgets\Redactor::className()) &#63;>
Copy after login

But if your form is not generated using Yii’s built-in components, you should configure it as follows

<&#63;= \yii\redactor\widgets\Redactor::widget([ 'model' => $model, 'attribute' => 'content' ]) &#63;>
Copy after login

4. The upload class uses a set of redactors, but you said that your upload class needs to be rewritten. It’s ok. You just need to add a few configurations as shown below

<&#63;= $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'] 
] 
]) &#63;>
Copy after login

5. Configure language or plug-ins, just like step 4, add lang and plugins configuration items in the clientOptions item. If you want to ask what plugins are there, open the directory vendorii2-redactorassetsplugins to have a look.

6. Be careful when uploading images, because redactor is introduced as a module. If your project contains permission management, remember to add permissions.

7. I forgot a major premise, make sure your php supports fileinfo extension. Open the php.ini file and remove the semicolon in front of fileinfo

The above is the Yii2 integrated rich text editor redactor example tutorial introduced by the editor. I hope it will be helpful to everyone!

www.bkjia.comtruehttp: //www.bkjia.com/PHPjc/1123834.htmlTechArticleA brief analysis of Yii2 integrated rich text editor redactor example tutorial, yii2redactor introduced to you how to use yii2 in the previous article Integrate Baidu editor umeditor and how to solve umeditor uploading pictures...
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template