Django使用tinymce富文本编辑器

1 - 安装

pip install django-tinymce==2.6.0

2 - 注册app

INSTALLED_APPS = (
    ...
    'tinymce',
)

3 - 在setting中添加配置

TINYMCE_DEFAULT_CONFIG = {
    'theme': 'advanced',
    'width': 600,
    'height': 400,
}

4 - 配置urls

url(r'^tinymce/', include('tinymce.urls')),

5 - 配置完成，下面开始使用

（1）后台使用

# 在models中：

from django.db import models
from tinymce.models import HTMLField

class Test(models.Model):
　　title = models.CharField(max_length=100)
　　content = HTMLField()

（2）自定义在前端页面使用

#1 路由：
path('',index),

#2 视图：

def index(request):

　　return render(request,'app01/index.html')

#3 页面 HTML 代码

# 在页面出现前需要引入静态文件：

　# 在python路径下找到tinymce目录，拷贝tiny_mce_src.js文件、langs文件夹以及themes文件夹拷贝到项目目录下的static/js/目录下

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>

　　<meta charset="UTF-8">
　　<title>index</title>
　　<script src="{% static 'js/tiny_mce_src.js' %}"></script>

</head>
<body>
　　<script>
　　　　tinyMCE.init({
　　　　'mode':'textareas',
　　　　'theme':'advanced',
　　　　'width':450,
　　　　'height':300
　　　　})
　　</script>

</body>
</html>

posted @ 2021-05-08 14:35 映辉阅读(569) 评论(0) 编辑收藏举报

刷新页面返回顶部

登录后才能查看或发表评论，立即登录或者逛逛博客园首页

阅读排行：
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型，支持深度思考和联网搜索！
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· ollama系列01：轻松3步本地部署deepseek，普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现

yhBlog