Django内容增加富文本功能的实例
2017-10-17 09:06
274 查看
缺少富文本,形式过于单一,不便于浏览与阅读。
一种可行的方法记录如下:
1-下载第三方富文本KindEditor,连接http://kindeditor.net/down.php或者baidu。
2-解压到Django项目下的static/js下,如图所示:
默认没有config.js,需要自行建立config.js,其中内容可参照KindEditor官网或以下代码:
KindEditor.ready(function(K) { K.create('textarea',{ width:700, height:200, }); }); #注意textarea的参照,width,height分别对文本框宽度、高度设置
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 %}
修改后:
6-文件上传还需要设置路径及相关配置,这个下一个记录当中说明。
以上这篇Django内容增加富文本功能的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- jquery动态增加text元素以及删除文本内容实例代码
- jquery动态增加text元素以及删除文本内容实例代码
- 如何实现 对输入框的文本内容进行限制的功能
- Joomla!扩展制作实例教程-模板展示组件-增加后台上传图片功能 【转】
- .NET+JS对用户输入内容进行字数提示功能的实例代码
- 禁用backspace键的后退功能,但是可以删除文本内容
- .NET+JS对用户输入内容进行字数提示功能的实例代码
- Eclipse rcp 实现文本内容对比功能
- Django分页功能快速实现(实例)
- java实现查找文本内容替换功能示例
- 为win7系统增加按文件内容搜索的功能
- 为“打开文件对话框”增加“预览”功能实例
- Java基于正则表达式实现的替换匹配文本功能【经典实例】
- Android Studio EditText点击图标清除文本内容的实例解析
- django开发项目实例3--用session是实现简单的登陆、验证登陆和注销功能
- 以增加收藏夹功能为实例,解析asp.net forums2结构流程及组件设计
- 重写struts2的TEXT标签对象以实现自己想在标签上增加默认显示内容的功能
- 基于jquery实现表格内容筛选功能实例解析
- 用户中心增加新功能实例
- 网站上的页面元素 Meta标签-关键字,描述,机器人和辅助功能标签页标题内容-定位整个副本的关键字的内容和支付链接-连接结构,ALT标签,文本链接的话和标题,页面上的各主要部分的关键字密度,HTML有