django-ckeditor

1 安装

pip install ckeditor

2 配置

  1. INSTALLED_APPS中添加

    'ckeditor',

    修改写入字段的格式

  2. 主题相关配置(settings)

    CKEDITOR_CONFIGS = {
    'default': {
    'toolbar': 'full',
    'height': 300,
    'width': 600,
    'tabSpaces': 4,
    'extraPlugins': 'codesnippet', # 配置代码插件
    }
    }
  3. 静态文件相关配置(图片)

    1 INSTALLED_APPS 中添加
    'ckeditor_uploader', 2 文件相关
    MEDIA_URL = '/media/'
    MEDIA_ROOT = os.path.join(BASE_DIR, 'media') CKEDITOR_UPLOAD_PATH = 'Article_media'
  4. URLconfig

    1. 引入包
    from django.conf.urls import url,include
    from django.views.static import serve
    1. urlpatterns
    urlpatterns = [
    ...
    url(r'^ckeditor/', include('ckeditor_uploader.urls'),),
    url(r'^media/(?P<path>.*)', serve, {"document_root": develop.MEDIA_ROOT}),
    ...
    ] 或 urlpatterns = [
    ...
    url(r'^ckeditor/', include('ckeditor_uploader.urls'),),
    ...
    ] + static(settings.MEDIA_URL, documnets_root = settings.MEDIA_ROOT)

3 使用

1 通用的方式,可以用在前台页面也可以用在后台管理页面

# 重写admin/Xadmin表单,在form添加装饰,而不需要修改对象模型,需要重写clean 方法,将表单拿到的数据替换成需要模型中真正存在的字段。
from ckeditor_uploader.widgets import CKEditorUploadingWidget class ArticleAdminForm(forms.ModelForm): # 模型中并不存在 content_ck 只是在表单中存在, 将在clean 中 提换,将页面数据和模型分离开 可以做一些其他操作
content_ck = forms.CharField(widget=CKEditorUploadingWidget(), label='正文', required=False) # 模型中的真实字段
content = forms.CharField(widget=forms.HiddenInput(), required=False) class Meta:
model = Article
fields = (
'category', 'tag', 'desc', 'title',
'editor_type', 'content', 'content_ck',
'status'
) def clean(self):
content = self.cleaned_data.get('content_ck')
if not content:
self.add_error('content_ck', '必填项!')
return
self.cleaned_data['content'] = content
return super().clean()

2 在Admin/Xadmin后台使用

直接修改模型字段将全部的事情交给admin 虽然省事,不灵活也不利于后期开发维护

from ckeditor.fields import RichTextField

class Article(models.Model):
title = models.CharField(max_length=254, unique=True)
body = RichTextField() def __str__(self):
return self.title

django-ckeditor使用的更多相关文章

  1. django + ckeditor + 七牛云,图片上传到七牛云

    传送门 本人使用的是 Django 的自带的管理后台,安装 ckeditor 富文本编辑器后,上传图片的时候直接传到七牛云的.

  2. Django ckeditor增加编辑代码 功能

    前言 使用ckeditor这个组件的时候 对于长写博客的同学当然希望能有 增加代码这个功能按钮 而这个按钮 需要自己配置 我们的编辑器自然需要添加代码块的功能. 需要用到插件codesnippet,c ...

  3. Django创建完全独立的APP

    我们之前已经完成了项目的结构搭建,但是,在Django当中,我们强调的一个重要概念是app,比如Django自带的admin就是一个成功的app典范,那么我们应该如果整理自己的项目结构,才能让我们的a ...

  4. Django博客开发-数据建模与样式设定

    开发流程介绍 之前Django的学习过程当中已经把基本Django开发学完了,现在以Django 的博客项目完成一遍课程的回顾和总结.同时来一次完整开发的Django体验. 一个产品从研究到编码我们要 ...

  5. django下的ckeditor 5.0 文本编辑器上传功能。

    完整的后台界面怎么可以没有文本编辑器,但是django的admin界面很疑惑,没有自带文本编辑器,好在网上有不少成型的库可以用 我用的是ckeditor编辑器,安装和配置我引用别人的博客 这篇博客配置 ...

  6. Django中使用CKEditor代码高亮显示插件Code Snippet

    Django使用CKEditor可以安装django-ckeditor这个模块,具体步骤可按照这里进行:http://www.nanerbang.com/article/2/ 我在富文本编辑器中想使用 ...

  7. 在django中集成ckeditor富文本

    目前用的比较多的富文本插件有百度的ueditor.ckeditor.kindeditor等,其中ueditor和kindeditor比较美观,ckeditor的皮肤较少.但是ueditor加载较慢,k ...

  8. ckeditor django admin 中使用

    ckeditor settings配置 ############ # CKEDITOR # ############ MEDIA_ROOT = os.path.join(BASE_DIR, 'medi ...

  9. django使用ckeditor上传图片

    1.在模型类中设置字段为富文本类型,这里需要注意引入的是RichTextUploadingField,以允许上传图片,需要和RichTextField区分开 from ckeditor_uploade ...

  10. Django添加ckeditor富文本编辑器

    源码 https://github.com/django-ckeditor/django-ckeditor 通过pip安装. pip3 install django-ckeditor pip3 ins ...

随机推荐

  1. Java 实现简单的人机猜拳游戏

    import java.util.Scanner; import java.util.Random; public class TestGuess{ public static void main(S ...

  2. 初始化加载和导航时脚本执行的函数(初始化脚本执行环境)page.evaluateOnNewDocument

    /** * Copyright 2017 Google Inc., PhantomJS Authors All rights reserved. * * Licensed under the Apac ...

  3. 车林通购车之家--购车计算器模块--算法js

    //CarCalculator.js var checkedClass = "jsq-item-check jsq-item-checked"; var uncheckedClas ...

  4. Lesson 6 The sporting spirit

    How does the writer describe sport at the international level? I am always amazed when I hear people ...

  5. Mysql使用存储过程创建测试数据

    一.概述 存储过程(Stored Procedure)是在大型数据库系统中,一组为了完成特定功能的SQL 语句集.其存储在数据库中,经过第一次编译后调用不需要再次编译,用户通过指定存储过程的名字并给出 ...

  6. 内核MKDEV(MAJOR, MINOR)

    版本:linux-2.6.24.4 宏: MKDEV(MAJOR, MINOR);   说明: 获取设备在设备表中的位置. MAJOR   主设备号 MINOR   次设备号     内核使用的版本号 ...

  7. docker-compose 快速部署Prometheus之服务端并监控ceph cluster 使用钉钉webhook 报警

    现在环境是这样: ceph 4台: 192.168.100.21  ceph-node1 192.168.100.22  ceph-node2 192.168.100.23  ceph-node3 1 ...

  8. WireShark 之抓包QQ协议

  9. 合天rev200.exe

    查过之后无壳,查看一下详细信息 运行一下. 猜测可能是输入两个password...拖到ida里面查看,shfit+f12查看 转到此处然后继续查看,找到第一个password通过 一开始时直接输入的 ...

  10. C++面试常见问题——14内存管理

    内存管理 内存管理由三种方式: 自动存储 静态存储 动态存储 自动存储 对于函数的形参.函数内部变量.和结构体变量等,编译器在函数运行过程中在栈中自动对其分配内存,调用结束后对其进行销毁.变量的声明周 ...