本文主要描述在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中虐块，我們就可以看到默認(rèn)的編譯器：
圖片只能通過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中關(guān)閉Django的autoscape過濾器挂据，看到的博文有可能是像下面這樣的：
關(guān)閉的語法如下：
{% autoescape off %}
{{ body }}
{% endautoescape %}
想要了解更多Django的信息，請去Django官網(wǎng)查看：Django - Built-in template tags and filters
場景三：定制編輯器儿普。想要定制編輯器崎逃，需要做三件事：在settings.py增加CKEDITOR_CONFIGS設(shè)定，在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里加入如下內(nèi)容。
hljs.initHighlightingOnLoad();
成果圖如下
官網(wǎng)給出的Sample得出的效果圖如下：
