django-blog-zinnia添加文本编辑器ckeditor

CKEditor文本编辑器是一款旨在简化Web内容编辑的即用(ready for use)的HTML文本编辑器。它是一款所见即所得(WYSIWYG)的编辑器,涵盖了常用的文本编辑功能。CKEditor是一款开源的应用,也就是说开发者可以根据实际需求修改源码。下面是CKEditor的实例

这是一个CKEditor的实例。

django-blog-zinnia的生态系统提供了对ckeditor编辑器的支持

具体配置过程如下:

一、配置django-ckeditor:

1. 从https://github.com/shaunsephton/django-ckeditor/下载django-ckeditor的源码压缩包,解压后将ckeditor目录拷贝至django项目的工程目录下

2. 在settings.py文件的INSTALLED_APPS数组中添加ckeditor

3. 执行collectstatic管理命令manage.py collectstatic(或者将django-ckeditor源码目录/static/下的/ckeditor/手工拷贝至django工程项目的静态文件目录STATIC_ROOT下)

4. 在项目配置文件settings.py中添加CKEDITOR_UPLOAD_PATH配置,由此指定CKEditor的媒体上传路径,CKEditor使用Django的存储API。缺省设置下Django使用文件系统储存后端(使用MEDIA_ROOT和MEDIA_URL),如果没有另外指定存储后端,你需要对MEDIA_ROOT下的CKEDITOR_UPLOAD_PATH路径拥有写权限。

5. 在项目urls.py文件中新增CKEditor的URL配置:

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

6. 设置CKEDITOR_IMAGE_BACKEND来启用CKEditor缩略图,缺省设置下图像不显示缩略图,以全尺寸形式展现。

二、配置zinnia-wysiwyg-ckeditor:

1. 从https://github.com/django-blog-zinnia/zinnia-wysiwyg-ckeditor下载zinnia-wysiwyg-ckeditor源码压缩包,解压后将zinnia_ckeditor拷贝到django项目的工程目录下 2. 在settings.py文件的INSTALLED_APPS数组中添加zinnia_ckeditor(添加到zinnia之后)

三、修改zinnia WYSIWYG配置:

修改zinnia/settings.py文件的WYSIWYG_MARKUP_MAPPING字典,变更为如下内容:

WYSIWYG_MARKUP_MAPPING = {
    'textile': 'markitup',
    'markdown': 'markitup',
    'restructuredtext': 'markitup',
    'html': 'ckeditor'
}

四、CKEditor参数配置:

在django项目目录的settings.py中添加变量CKEDITOR_CONFIGS,例如:

CKEDITOR_CONFIGS = {
  'default': {
    'skin': 'moono',
    'toolbar': 'Full',
    'toolbarGroups' : [
      { 'name': 'clipboard',   'groups': [ 'clipboard', 'undo' ] },
      { 'name': 'editing',	 'groups': [ 'find', 'selection', 'spellchecker' ] },
      { 'name': 'links' },
      { 'name': 'insert' },
      { 'name': 'forms' },
      { 'name': 'tools' },
      { 'name': 'document',	   'groups': [ 'mode', 'document', 'doctools' ] },
      { 'name': 'others' },
      '/',
      { 'name': 'basicstyles', 'groups': [ 'basicstyles', 'cleanup' ] },
      { 'name': 'paragraph',   'groups': [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
      { 'name': 'styles' },
      { 'name': 'colors' },
      { 'name': 'about' },
    ],
    'width' : 960,
    'height' : 380,
    'removeButtons' : 'Underline,Subscript,Superscript',
    'format_tags' : 'p;h1;h2;h3;pre',
    'removeDialogTabs' : 'image:advanced;link:advanced',
    'extraPlugins' : 'sourcedialog,codemirror,widget,lineutils,codesnippet,selectall',
    'codemirror' : {
      'theme': 'default',
      'lineNumbers': True,
      'lineWrapping': True,
      'matchBrackets': True,
      'autoCloseTags': True,
      'autoCloseBrackets': True,
      'enableSearchTools': True,
      'enableCodeFolding': True,
      'enableCodeFormatting': True,
      'autoFormatOnStart': False,
      'autoFormatOnModeChange': False,
      'autoFormatOnUncomment': False,
      'highlightActiveLine': True,
      'mode': 'htmlmixed',
      'showSearchButton': True,
      'showTrailingSpace': True,
      'highlightMatches': True,
      'showFormatButton': True,
      'showCommentButton': True,
      'showUncommentButton': True,
      'showAutoCompleteButton': True
    },
    'allowedContent' : True,
  },
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值