CKEditor 为你的Flask项目添加一个富文本编辑器

Leleprogrammer

已于 2022-12-30 17:30:14 修改

阅读量1.4k

点赞数 5

文章标签： flask python 后端

于 2022-12-30 17:26:04 首次发布

本文链接：https://blog.csdn.net/leleprogrammer/article/details/128498294

版权

人家高高在上的CKEditor是有个官网的！！

首先要选择你想要的编辑器样式

Basic模式很小巧，有18个插件

Standard就比较多啦，它有61个插件

Full包含所有功能，87个插件

这边有更多的插件

不过还是不搞那么复杂吧，默认就好（doge）

接下来选择样式

最后选择语言

然后下载就好啦

下载下来是个ZIP

给它解压一下里面有个ckeditor

里面是编辑器的文件

把整个ckeditor丢进static里面

HTML中加入下面代码

<script src="/static/ckeditor/ckeditor.js"> </script>

FlaskForm还是照常使用

      <div class="form-group">
        <h4 class="white_theme">{{ form.text.label }}</h4> {{ form.text(class="form-control") }}
      </div>

然后命令行pip install flask-ckeditor安装一下对应的第三方库，然后导入

from flask_ckeditor import CKEditorField

表单类中把TextAreaField改为CKEditorField

    text=CKEditorField("内容",validators=[
        validators.DataRequired(),
        validators.Length(1,BlogLengthMaximum)
    ])

最后在HTML表单中加入这一行就好啦

{{ ckeditor.load() }}

到这样，我们就可以召唤出可爱的CKEditor啦~~~

p.s. 插个题外话，进入CKEditorField的原代码：

可以看到CKEditorField实质上取代了TextAreaField（呵呵）

喜欢的话就来个3连吧~~~

关注