Django自带的TextField文本编辑器太过简单,就是一张白纸。最近做了个博客,打算添加免费而又功能强大的富文本编辑器ckeditor。这样用户在写博客时就可以在正文里上传图片或直接写html代码了。网上看了些教程,觉得下面这篇文章不错。小编我已在Django 2.0下验证成功,所以推荐给大家。用一句话来说:添加过程非常顺利,效果出奇的好。
1.通过PIP安装django-ckeditor
1
|
pip install django
-
ckeditor
|
2.将‘ckeditor’和'ckeditor_uploader'加入到settings.py中的INSTALLED_APPS中
Django大咖之路备注:ckeditor不允许用户上传图像和其它文件,只能编辑文本。如果你希望用户能直接上传文本,需要把ckeditor_uploader也加上去。
3.由于djang-ckeditor在ckeditor-init.js文件中使用了JQuery,所以要在settings.py中设置CKEDITOR_JQUERY_URL来指定JQuery库的路径,例如:
1
|
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大咖之路备注:假如你的项目mysite,app是blog。你需要在mysite文件里新建了个static文件夹。在下载前你需要先设定STATIC_ROOT, 下载完成后,你需要删掉它。最后mysite/setting.py文件应该是这样子的。
CKEDITOR_JQUERY_URL ='https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js'
CKEDITOR_IMAGE_BACKEND = "pillow"
CKEDITOR_UPLOAD_PATH = "uploads/"
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, "static"), ]
# specify media root for user uploaded files, i.e, upload_to filed for ImageField or FileField.
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
5 在models.py里可按如下方式使用。field字段改为RichTextField即可。
from django.db import models
from ckeditor.fields import RichTextField
class Blog(models.Model):
title = models.CharField(max_length=50,verbose_name="标题")
body = RichTextField(blank=True,null=True,verbose_name="内容") def __unicode__(self):
return self.name
实际展示效果如下,还是非常美观的。
如果你想用户通过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')),
如果不加,可能会出现以下错误:
4(可选项) 在settings.py中加入CKEDITOR_IMAGE_BACKEND
,使能thumbnails,例如:
CKEDITOR_IMAGE_BACKEND = "pillow"
from ckeditor_uploader.fields import RichTextUploadingField
class Post(models.Model):
content = RichTextUploadingField()
Django-ckeditor英文说明: https://github.com/django-ckeditor/django-ckeditor
中文原文链接: http://www.cnblogs.com/hupeng1234/p/6639122.html
欢迎关注我们。