Tinymce富文本 前台和后台的使用

 一,后台 Admin

  1. 于 settings.py 文件中修改 INSTALLED_APPS

  

  2. 于 settings.py 文件中增添如下配置

 # 富文本配置
TINYMCE_DEFAULT_CONFIG = {
'theme': 'advanced',
'width': 600,
'height': 400,
}

  3. 于 工程目录下的urls.py文件中增添如下路径

     re_path('^tinymce/', include(('tinymce.urls', 'tinymce'), namespace='tinymce')),  # 富文本

  4. 于 App目录下的 admin.py文件 中 进行如下操作

 from tinymce.models import HTMLField

 # 某一模型中的介绍文本输入
content = HTMLField(verbose_name="主要介绍")

  5. 大公完成

二,前台 Templates

  1. 于 父模板 或 所在模板中增添

 <script src="{% static 'tiny_mce/tiny_mce.js'%}"></script>
<script>
tinyMCE.init({
'mode':'textareas',
'theme': 'advanced',
'width': 850,
'height': 300,
})
</script>

  2. 下面所以的 textareas 就显示为 富文本 样式了

         <div> <label for="content">主要介绍</label> <textarea name="content" id="content" cols="" rows=""></textarea></div>

补充:注意点

  有的 教程 说要 从 下载的 python 环境中 找到 tiny_mce.js 或 tiny_mce_src.js 放到 静态目录下再引用,但是很大几率不对,显示不出来

    django 自带的 富文本 直接引用 /static/tiny_mce/tiny_mce.js 即可,不用管是否自己创建的静态目录下是否能看见的说

最新文章

  1. OpenGL中glVertex、显示列表(glCallList)、顶点数组(Vertex array)、VBO及VAO区别
  2. redis-cache中的callback
  3. nfs服务器设置
  4. Linux访问Windows磁盘实现共享
  5. Java_Hbase优化
  6. iOS开发——实用篇Swift篇&amp;状态栏操作
  7. Mina学习之IoBuffer
  8. android 安全退出应用程序的几种方法
  9. 单点登录CAS使用记(二):部署CAS服务器以及客户端
  10. Android系统五大布局详解Layout
  11. nodejs运用passport和passport-local分离本地登录
  12. 搭建多系统yum服务器
  13. 获取url参数值(可解码中文值)
  14. 前端使用Mock服务Json-server
  15. Django:学习笔记
  16. Pandas 基础(12) - Stack 和 Unstack
  17. c语言基本数据类型(short、int、long、char、float、double)
  18. STM32F4—fsmc的配置步骤
  19. Migrating from Spring 3 to Spring 4 - org.springframework.scheduling.quartz.CronTriggerBean
  20. 关于README的内容

热门文章

  1. SAP S4HANA TR传输之操作
  2. CentOS 7上的进程管理
  3. webpack 插件 ProvidePlugin 的使用方法和 eslint 配置
  4. linux 常用Mysql脚本命令
  5. Unity Ruby&#39;s Adventure 第一步
  6. 在Mac上安装JDK1.8及环境变量配置
  7. C# 使用System.Media.SoundPlayer播放wav格式的声音文件
  8. SpringBoot+idea搭建微服务简化流程
  9. Android 监听手机锁屏的工具类
  10. python 基础学习笔记(4)--字典 和 集合