django添加富文本

1.通过PIP安装django-ckeditor

1
pip install django-ckeditor

2.将‘ckeditor’和’ckeditor_uploader’加入到settings.py中的INSTALLED_APPS中

备注：ckeditor不允许用户上传图像和其它文件，只能编辑文本。如果你希望用户能直接上传文本，需要把ckeditor_uploader也加上去。

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/’)

备注：假如你的项目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"), ]

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()

5、富文本前端显示：（坑）

前端代码要加入 {{ new.body | safe }} 防止django转义

这样前端才会显示富文本内容