Django CKEditor 使用教程

1. 项目介绍

Django CKEditor 是一个用于集成CKEditor到Django管理后台的开源库。它提供了一个RichTextField、RichTextUploadingField字段以及相应的CKEditor小部件，支持图片上传和浏览功能。该版本还包含了对django-storages(如S3存储)的支持，更新至CKEditor 4.18.0版本，并包含了所有CKEditor语言和插件文件。

2. 项目快速启动

安装

首先确保你的Python环境是3.8或以上版本，然后通过pip安装django-ckeditor：

pip install django-ckeditor

配置

在你的Django项目的settings.py中添加以下配置：

INSTALLED_APPS = [
    ...
    'ckeditor',
]

CKEDITOR_CONFIGS = {
    'default': {
        'skin': 'moono',
        'toolbar_Basic': [
            ['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink'],
        ],
        'toolbar_Full': [
            ...
        ],
        'width': '100%',
        'height': '300px',
        'image_upload_url': '/admin/ckeditor/upload_image/',
    }
}

URL映射

将以下URL模式添加到你的urls.py文件中：

from django.urls import path
fromckeditor.views import upload_image as ckeditor_upload_image

urlpatterns = [
    ...
    path('ckeditor/upload_image/', ckeditor_upload_image, name='ckeditor_upload_image'),
]

在模型中使用

在你的模型类中定义富文本字段：

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

class MyModel(models.Model):
    content = RichTextField()

在Admin界面中注册

在admin.py中注册你的模型：

from django.contrib import admin
from .models import MyModel

admin.site.register(MyModel)

现在你可以访问Django管理后台并使用CKEditor编辑器了。

3. 应用案例和最佳实践

• 最佳实践是在生产环境中配置CKEDITOR_BASEPATH以指向静态文件目录。
• 对于图像上传，可以配置CKEDITOR_UPLOAD_PATH来指定上传图片的保存路径。
• 若要限制允许的HTML标签，可以设置allowedContent配置项。

4. 典型生态项目

• django-storages: 提供Amazon S3和其他云存储服务的Django集成，Django CKEditor支持与其配合使用。
• django-js-asset: 管理前端JavaScript资产的Django库，Django CKEditor要求其较新版本以兼容Django 4.1。

现在你应该已经成功地在你的Django项目中集成了CKEditor。享受在管理界面中的富文本编辑体验吧！如果你遇到任何问题，记得查看项目文档和GitHub上的Issue列表以寻求帮助。