django轻松使用富文本编辑器CKEditor的方法


Posted in Python onMarch 30, 2017

前言

django是一个容易快速上手的web框架,用它来创建内容驱动型的网站(比如独立博客)十分方便。遗憾的是,django并没有提供官方的富文本编辑器,而后者恰好是内容型网站后台管理中不可或缺的控件。ckeditor是一款基于javascript,使用非常广泛的开源网页编辑器。它可以和多种编程语言相结合,python当然也不例外。本文就来介绍一下如何在基于django博客系统如何完美地用上ckeditor。

使用方法

1、安装

pip install django-ckeditor

2、将‘ckeditor'settings.py中的INSTALLED_APPS

3、由于djang-ckeditor在ckeditor-init.js文件中使用了JQuery,所以要在settings.py中设置CKEDITOR_JQUERY_URL来指定JQuery库的路径,例如:

CKEDITOR_JQUERY_URL ='https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js'

4、设定STATIC_ROOT,执行python manage.py collectstatic,将CKEditor需要的媒体资源拷入STATIC_ROOT指定的路径中。

STATIC_ROOT = os.path.join(BASE_DIR,'static/')

django轻松使用富文本编辑器CKEditor的方法

5、

from django.db import models
from ckeditor.fields import RichTextField

class Blog(models.Model):
 title = models.CharField(max_length=50,verbose_name="标题")
 content = RichTextField(blank=True,null=True,verbose_name="内容")

 def __unicode__(self):
 return self.name

效果:

django轻松使用富文本编辑器CKEditor的方法

文件上传

1、在settings.py中的INSTALLED_APPS中添加ckeditor_uploader

2、CKEditor使用Django的存储API,默认使用Django的文件存储,会用到MEDIA_ROOT和MEDIA_URL,需要在settings.py中定义,此外还可以指定CKEDITOR_UPLOAD_PATH,它位于MEDIA_ROOT下:

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR,'media/')
CKEDITOR_UPLOAD_PATH = 'uploads/'

3、在项目的urls.py中添加CKEditor的URL映射

url(r'^ckeditor/', include('ckeditor_uploader.urls')),

如果不加,可能会出现以下错误:

django轻松使用富文本编辑器CKEditor的方法

4、(可选项) 在settings.py中加入CKEDITOR_IMAGE_BACKEND ,使能thumbnails,例如:

CKEDITOR_IMAGE_BACKEND = 'PIL'
from ckeditor_uploader.fields import RichTextUploadingField
class Post(models.Model):
 content = RichTextUploadingField()

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Python 相关文章推荐
python 回调函数和回调方法的实现分析
Mar 23 Python
Python自动化测试Eclipse+Pydev 搭建开发环境
Aug 15 Python
Django URL传递参数的方法总结
Aug 28 Python
利用Python开发实现简单的记事本
Nov 15 Python
Python实现的弹球小游戏示例
Aug 01 Python
Python pyinotify日志监控系统处理日志的方法
Mar 08 Python
如何利用python查找电脑文件
Apr 27 Python
python小白切忌乱用表达式
May 29 Python
解决Pycharm 中遇到Unresolved reference 'sklearn'的问题
Jul 13 Python
浅析Python 中的 WSGI 接口和 WSGI 服务的运行
Dec 09 Python
Python使用random模块实现掷骰子游戏的示例代码
Apr 29 Python
基于Python实现股票收益率分析
Apr 02 Python
python下读取公私钥做加解密实例详解
Mar 29 #Python
django开发之settings.py中变量的全局引用详解
Mar 29 #Python
深入理解Python3中的http.client模块
Mar 29 #Python
Python 中迭代器与生成器实例详解
Mar 29 #Python
Python利用Beautiful Soup模块搜索内容详解
Mar 29 #Python
windows系统下Python环境搭建教程
Mar 28 #Python
Python中Django 后台自定义表单控件
Mar 28 #Python
You might like
php 清除网页病毒的方法
2008/12/05 PHP
判断PHP数组是否为空的代码
2011/09/08 PHP
php实现excel中rank函数功能的方法
2015/01/20 PHP
php实现购物车功能(上)
2020/07/23 PHP
QQ邮箱的一个文本编辑器代码
2007/03/14 Javascript
javascript与CSS复习(三)
2010/06/29 Javascript
jquery实现不同大小浏览器使用不同的css样式表的方法
2014/04/02 Javascript
jQuery中:nth-child选择器用法实例
2014/12/31 Javascript
jquery实现邮箱自动填充提示功能
2015/11/17 Javascript
JS操作XML实例总结(加载与解析XML文件、字符串)
2015/12/08 Javascript
Jquery元素追加和删除的实现方法
2016/05/24 Javascript
jQuery数据检索中根据关键字快速定位GridView指定行的实现方法
2016/06/08 Javascript
Node.js连接postgreSQL并进行数据操作
2016/12/18 Javascript
微信小程序的日期选择器的实例详解
2017/09/29 Javascript
Angular表格神器ui-grid应用详解
2017/09/29 Javascript
Node.Js中实现端口重用原理详解
2018/05/03 Javascript
vue.js实现回到顶部动画效果
2019/07/31 Javascript
vue实现鼠标经过动画
2019/10/16 Javascript
基于p5.js 2D图像接口的扩展(交互实现)
2020/11/30 Javascript
pycharm 使用心得(二)设置字体大小
2014/06/05 Python
Windows系统配置python脚本开机启动的3种方法分享
2015/03/10 Python
在Python中,不用while和for循环遍历列表的实例
2019/02/20 Python
Python人工智能之路 之PyAudio 实现录音 自动化交互实现问答
2019/08/13 Python
Python 文件操作之读取文件(read),文件指针与写入文件(write),文件打开方式示例
2019/09/29 Python
django 数据库 get_or_create函数返回值是tuple的问题
2020/05/15 Python
Python pymysql模块安装并操作过程解析
2020/10/13 Python
python re.match()用法相关示例
2021/01/27 Python
Python创建自己的加密货币的示例
2021/03/01 Python
CSS3制作ajax loader icon实现思路及代码
2013/08/25 HTML / CSS
eBay美国官网:eBay.com
2020/10/24 全球购物
公司中秋节活动方案
2014/02/12 职场文书
“九一八事变纪念日”国旗下讲话稿
2014/09/14 职场文书
2014年团支部工作总结
2014/11/17 职场文书
团队拓展训练心得体会
2016/01/12 职场文书
高三化学教学反思
2016/02/22 职场文书
2019年预备党员的思想汇报:加深对党的认知
2019/09/25 职场文书