Django 集成 CKEditor 踩过的坑
目录
上一次说到了在 django 中集成 tinymce。但在使用过程中发现功能不够强大。如自定义css, 上传文件等功能缺失,所以转向功能更全的 ckeditor
该项目在github上开源。
基本按照 github 上的简介就可以将其集成到项目里。但也有一些坑:
语言设置为中文
以下设置一个都不能少:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
LANGUAGE_CODE = 'en-us' TIME_ZONE = 'Asia/Shanghai' USE_I18N = True LANGUAGES = [ ('en', 'English'), ('zh-cn', 'Chinese'), ] MIDDLEWARE_CLASSES = [ … 'django.middleware.locale.LocaleMiddleware', ] |
上传图片
settings.py
中以下设置
1 2 3 4 5 6 7 8 |
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/') MEDIA_URL = '/media/' CKEDITOR_UPLOAD_PATH = "uploads/" INSTALLED_APPS = [ … "ckeditor_uploader", ] |
其中 CKEDITOR_UPLOAD_PATH
必须是相对路径,相对基地址为 MEDIA_URL
在 model 中使用时,使用 from ckeditor.fields import RichTextField
, 在 form 中使用时,使用 from ckeditor_uploader.fields import RichTextUploadingFormField
Toolbar
使用自定义的 toolbar 时,配置如下:
1 2 3 4 5 6 7 8 9 10 11 |
CKEDITOR_CONFIGS = { 'default': { 'toolbar_mytoolbar': [ {'name': 'clipboard', 'items': ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo']}, # others … ], 'toolbar': 'mytoolbar', 'height': 500, 'width': 1024, }, } |
务必注意,自定义名称需要使用 toolbar_
前缀
添加内置插件
希望插入的图片带有标题,搜索发现有内置插件 Enhanced Image 。具体文档戳这里。
在 setting.py
中添加配置:
1 2 3 4 5 6 |
CKEDITOR_CONFIGS = { 'default': { … 'extraPlugins': ','.join(['image2']), }, } |