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 从远程服务器下载日志文件的程序
Feb 10 Python
Python 抓取动态网页内容方案详解
Dec 25 Python
用Python进行基础的函数式编程的教程
Mar 31 Python
Python遍历目录的4种方法实例介绍
Apr 13 Python
解密Python中的描述符(descriptor)
Jun 03 Python
深入剖析Python的爬虫框架Scrapy的结构与运作流程
Jan 20 Python
Python 获得13位unix时间戳的方法
Oct 20 Python
用不到50行的Python代码构建最小的区块链
Nov 16 Python
Django admin实现图书管理系统菜鸟级教程完整实例
Dec 12 Python
python groupby 函数 as_index详解
Dec 16 Python
pycharm 如何查看某一函数源码的快捷键
May 12 Python
Python中zipfile压缩包模块的使用
May 14 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 Socket 编程
2010/04/09 PHP
php语言流程控制中的主动与被动
2012/11/05 PHP
在windows平台上构建自己的PHP实现方法(仅适用于php5.2)
2013/07/05 PHP
PHP session 会话处理函数
2016/06/06 PHP
PHP通过bypass disable functions执行系统命令的方法汇总
2018/05/02 PHP
PHP命名空间用法实例分析
2019/09/04 PHP
JS重要知识点小结
2011/11/06 Javascript
JavaScript中具名函数的多种调用方式总结
2014/11/08 Javascript
用js读、写、删除Cookie代码续篇
2014/12/03 Javascript
jQuery对于显示和隐藏等常用状态的判断方法
2014/12/13 Javascript
JavaScript操作XML文件之XML读取方法
2015/06/09 Javascript
js获取鼠标点击的对象,点击另一个按钮删除该对象的实现代码
2016/05/13 Javascript
原生js和jquery分别实现横向导航菜单效果
2016/05/13 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
2016/06/21 Javascript
深入理解bootstrap框架之入门准备
2016/10/09 Javascript
微信小程序 教程之小程序配置
2016/10/17 Javascript
详解js中Number()、parseInt()和parseFloat()的区别
2016/12/20 Javascript
jquery animate动画持续运动的实例
2017/11/29 jQuery
Angular2实现组件交互的方法分析
2017/12/19 Javascript
微信小程序利用swiper+css实现购物车商品删除功能
2019/03/06 Javascript
实例详解带参数的 npm script
2019/05/28 Javascript
[00:47]DOTA2荣耀之路6:天火,天火!
2018/05/30 DOTA
Python中itertools模块用法详解
2014/09/25 Python
Python远程桌面协议RDPY安装使用介绍
2015/04/15 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
html5 利用canvas手写签名并保存的实现方法
2018/07/12 HTML / CSS
最便宜促销价格订机票:Airpaz(总部设在印尼,支持中文)
2018/11/13 全球购物
CK澳大利亚官网:Calvin Klein澳大利亚
2020/12/12 全球购物
房地产开发计划书
2014/01/10 职场文书
新员工试用期自我鉴定
2014/04/17 职场文书
销售人员求职信
2014/07/22 职场文书
2014年党务公开工作总结
2014/12/09 职场文书
商务邀请函
2015/01/30 职场文书
2015大一新生军训感言
2015/08/01 职场文书
会计专业自荐信范文
2019/05/22 职场文书
python编程学习使用管道Pipe编写优化代码
2021/11/20 Python