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

yipeiwu_com6年前Python基础

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

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

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内容增加富文本功能的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持【听图阁-专注于Python设计】。

相关文章

使用python将图片按标签分入不同文件夹的方法

使用python将图片按标签分入不同文件夹的方法

给定图像集如下,所有类别的图片均在一个文件夹内: 给定与图片名相匹配的表格,声明每张图片对应的类别(共有20个类别): 那么,如何根据表格中所给的类别将图片分入对应的文件夹内呢?以我...

插入排序_Python与PHP的实现版(推荐)

插入排序Python实现 import random a=[random.randint(1,999) for x in range(0,36)] # 直接插入排序算法 def...

使用 Python 玩转 GitHub 的贡献板(推荐)

使用 Python 玩转 GitHub 的贡献板(推荐)

细心的人都会发现GitHub个人主页有一个记录每天贡献次数的面板,我暂且称之为贡献面板。就像下图那个样子。只要当天在GitHub有提交记录,对应的小格子就会变成绿色,当天提交次数越多,颜...

python中的多重继承实例讲解

python中的多重继承实例讲解

python和C++一样,支持多继承。概念虽然容易,但是困难的工作是如果子类调用一个自身没有定义的属性,它是按照何种顺序去到父类寻找呢,尤其是众多父类中有多个都包含该同名属性。 对经典类...

Python实现的简单读写csv文件操作示例

Python实现的简单读写csv文件操作示例

本文实例讲述了Python实现的简单读写csv文件操作。分享给大家供大家参考,具体如下: python中有一个读写csv文件的包,直接import csv即可 新建test.csv 1....