Django内容增加富文本功能的实例


Posted in Python onOctober 17, 2017

缺少富文本,形式过于单一,不便于浏览与阅读。

一种可行的方法记录如下:

1-下载第三方富文本KindEditor,连接http://kindeditor.net/down.php或者baidu。

2-解压到Django项目下的static/js下,如图所示:

Django内容增加富文本功能的实例

默认没有config.js,需要自行建立config.js,其中内容可参照KindEditor官网或以下代码:

KindEditor.ready(function(K) {
    K.create('textarea',{
     width:700,
     height:200,
    });
  });

#注意textarea的参照,width,height分别对文本框宽度、高度设置

Django内容增加富文本功能的实例

3-在你的admin.py中,需要增加富文本的类别代码形式如下:

class ArticleAdmin(admin.ModelAdmin):
  class Media:
   js={
    '/static/js/kindeditor/lang/zh-CN.js',
    '/static/js/kindeditor/kindeditor-all-min.js',
    '/static/js/kindeditor/config.js',
   }
 
 
admin.site.register(Article, ArticleAdmin)

4-至此,刷新后就可以看到内容区增加了富文本编辑功能了,如果没有需要对照上述步骤仔细检查下,不熟练的情况下copy代码不要修改

5-最后我这边遇到了一个小坑,增加了格式的页面在浏览时显示了html语法,需要关闭html转义,

方法是在模板中修改:

将{{ article.content }}修改为

{{ article.content|safe }},另一种方法是:

{% autoescape off %}

{{ article.content }}
{% endautoescape %}

Django内容增加富文本功能的实例

修改后:

Django内容增加富文本功能的实例

6-文件上传还需要设置路径及相关配置,这个下一个记录当中说明。

以上这篇Django内容增加富文本功能的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
详解Python中用于计算指数的exp()方法
May 14 Python
Python使用turtule画五角星的方法
Jul 09 Python
基于hashlib模块--加密(详解)
Jun 21 Python
python实现在IDLE中输入多行的方法
Apr 19 Python
基于Pandas读取csv文件Error的总结
Jun 15 Python
Python3调用百度AI识别图片中的文字功能示例【测试可用】
Mar 13 Python
如何用C代码给Python写扩展库(Cython)
May 17 Python
python3 tkinter实现点击一个按钮跳出另一个窗口的方法
Jun 13 Python
python自定义时钟类、定时任务类
Feb 22 Python
python操作微信自动发消息的实现(微信聊天机器人)
Jul 14 Python
Django后端按照日期查询的方法教程
Feb 28 Python
python munch库的使用解析
May 25 Python
Python通过future处理并发问题
Oct 17 #Python
python3设计模式之简单工厂模式
Oct 17 #Python
基于Python和Scikit-Learn的机器学习探索
Oct 16 #Python
python版简单工厂模式
Oct 16 #Python
Python实现扩展内置类型的方法分析
Oct 16 #Python
Python使用文件锁实现进程间同步功能【基于fcntl模块】
Oct 16 #Python
python利用paramiko连接远程服务器执行命令的方法
Oct 16 #Python
You might like
php中可能用来加密字符串的函数[base64_encode、urlencode、sha1]
2012/01/16 PHP
关于PHP的相似度计算函数:levenshtein的使用介绍
2013/04/15 PHP
php实现约瑟夫问题的方法小结
2015/03/23 PHP
提高Laravel应用性能方法详解
2019/06/24 PHP
javascript 延迟加载技术(lazyload)简单实现
2011/01/17 Javascript
jQuery动画特效实例教程
2014/08/29 Javascript
JavaScript中实现最高效的数组乱序方法
2014/10/11 Javascript
jquery实现标签支持图文排列带上下箭头按钮的选项卡
2015/03/14 Javascript
JavaScript中getUTCSeconds()方法的使用详解
2015/06/11 Javascript
jquery中ajax跨域方法实例分析
2015/12/18 Javascript
Bootstrap栅格系统使用方法及页面调整变形的解决方法
2017/03/10 Javascript
Vue+Jwt+SpringBoot+Ldap完成登录认证的示例代码
2018/05/21 Javascript
利用Node.js批量抓取高清妹子图片实例教程
2018/08/02 Javascript
es6函数中的作用域实例分析
2020/04/18 Javascript
跟老齐学Python之list和str比较
2014/09/20 Python
Python实现递归遍历文件夹并删除文件
2016/04/18 Python
Django中利用filter与simple_tag为前端自定义函数的实现方法
2017/06/15 Python
Python获取当前页面内所有链接的四种方法对比分析
2017/08/19 Python
Python可变参数*args和**kwargs用法实例小结
2018/04/27 Python
matplotlib subplots 调整子图间矩的实例
2018/05/25 Python
Python 中使用 PyMySQL模块操作数据库的方法
2019/11/10 Python
Django实现内容缓存实例方法
2020/06/30 Python
Python通过字典映射函数实现switch
2020/11/06 Python
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
阿玛尼化妆品美国官网:Giorgio Armani Beauty
2017/02/02 全球购物
Gloeilampgoedkoop荷兰:在线购买灯泡
2019/02/16 全球购物
巴西购物网站:Submarino
2020/01/19 全球购物
美容师的职业规划书
2013/12/27 职场文书
2014年幼儿园学期工作总结
2014/12/05 职场文书
党员违纪检讨书
2015/05/05 职场文书
心灵捕手观后感
2015/06/02 职场文书
导游词之青城山景区
2019/09/27 职场文书
导游词之山东孔庙
2019/11/04 职场文书
创业计划书之酒吧
2019/12/02 职场文书
浅谈sql_@SelectProvider及使用注意说明
2021/08/04 Java/Android
【海涛教你打DOTA】死灵飞龙第一视角解说
2022/04/01 DOTA