本文主要描述在admin中CKEditor的使用场景和方法。
如果你打算使用Django来做一个属于自己的博客，在编辑博文的时候，有时需要增加一些格式或者图片这样的多媒体，想要使用Django自带的编辑器来处理这些问题是一件很麻烦的事情，这时如果使用CKEditor可以解决很多问题。
场景一：使用不带图片上传功能的文本编辑器，可以使用RichTextField。修改/your_project/your_app/models.py：
fromckeditor.fieldsimportRichTextFieldclassPost(models.Model):# --- The Original Django Version ---# body = models.TextField()# --- CKEditor Version --- #body = RichTextField(verbose_name='Content')}
在Admin中，我们就可以看到默认的编译器：
图片只能通过url来处理，如下：
场景二：使用带图片上传功能的文本编辑器，可以使用RichTextUploadingField。修改/your_project/your_app/models.py：
#from ckeditor.fields import RichTextFieldfromckeditor_uploader.fieldsimportRichTextUploadingFieldclassPost(models.Model):# --- The Original Django Version ---# body = models.TextField()# --- CKEditor Version --- #body = RichTextUploadingField()}
在Admin中我们，可以看到如下图：
另外，以上两种场景，如果不修改在你的HTML中关闭Django的autoscape过滤器，看到的博文有可能是像下面这样的：
关闭的语法如下：
{% autoescape off %}
{{ body }}
{% endautoescape %}
想要了解更多Django的信息，请去Django官网查看：Django - Built-in template tags and filters
场景三：定制编辑器。想要定制编辑器，需要做三件事：在settings.py增加CKEDITOR_CONFIGS设定，在models.py里增加指定配置，在templates中加入CKEditor的脚本。另外，CKEditors有一个叫做Code Snippet的插件非常好用，可以在编译器里增加代码。
setttings.py
注：‘-’表示分割竖线，‘name’表示一个工具栏， ‘／’表示换行。
CKEDITOR_CONFIGS = {'default': {'skin':'moono','toolbar_YourCustomToolbarConfig': [ {'name':'basicstyles','items': ['Bold','Italic','Underline','Strike','Subscript','Superscript']}, {'name':'links','items': ['Link','Unlink']}, {'name':'insert','items': ['CodeSnippet','Image','Table','PageBreak','HorizontalRule','SpecialChar','Iframe']}, {'name':'paragraph','items': ['NumberedList','BulletedList','-','Blockquote','-','Outdent','Indent','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl']},'/', {'name':'styles','items': ['Styles','Format','Font','FontSize']}, {'name':'colors','items': ['TextColor','BGColor']}, {'name':'tools','items': ['Maximize','ShowBlocks']}, ],'toolbar':'YourCustomToolbarConfig',# put selected toolbar config here'tabSpaces':4,'extraPlugins':','.join(['uploadimage',# the upload image feature'div','autolink','autoembed','embedsemantic','autogrow','widget','dialog','lineutils','codesnippet']),'codeSnippet_theme':'atelier-dune.dark', }}
models.py
body = RichTextUploadingField(config_name='default')
templates的head里加入如下内容。
hljs.initHighlightingOnLoad();
成果图如下
官网给出的Sample得出的效果图如下：
原文地址：http://realricecake.cc/blog/2017/08/30/django-ckeditor-guide-2/
网友评论