django-ckeditor使用
django-ckeditor
1 安装
pip install ckeditor
2 配置
INSTALLED_APPS中添加
'ckeditor',
修改写入字段的格式
主题相关配置(settings)
CKEDITOR_CONFIGS = {
'default': {
'toolbar': 'full',
'height': 300,
'width': 600,
'tabSpaces': 4,
'extraPlugins': 'codesnippet', # 配置代码插件
}
}
静态文件相关配置(图片)
1 INSTALLED_APPS 中添加
'ckeditor_uploader', 2 文件相关
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media') CKEDITOR_UPLOAD_PATH = 'Article_media'
URLconfig
- 引入包
from django.conf.urls import url,include
from django.views.static import serve
- 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使用的更多相关文章
- django + ckeditor + 七牛云,图片上传到七牛云
传送门 本人使用的是 Django 的自带的管理后台,安装 ckeditor 富文本编辑器后,上传图片的时候直接传到七牛云的.
- Django ckeditor增加编辑代码 功能
前言 使用ckeditor这个组件的时候 对于长写博客的同学当然希望能有 增加代码这个功能按钮 而这个按钮 需要自己配置 我们的编辑器自然需要添加代码块的功能. 需要用到插件codesnippet,c ...
- Django创建完全独立的APP
我们之前已经完成了项目的结构搭建,但是,在Django当中,我们强调的一个重要概念是app,比如Django自带的admin就是一个成功的app典范,那么我们应该如果整理自己的项目结构,才能让我们的a ...
- Django博客开发-数据建模与样式设定
开发流程介绍 之前Django的学习过程当中已经把基本Django开发学完了,现在以Django 的博客项目完成一遍课程的回顾和总结.同时来一次完整开发的Django体验. 一个产品从研究到编码我们要 ...
- django下的ckeditor 5.0 文本编辑器上传功能。
完整的后台界面怎么可以没有文本编辑器,但是django的admin界面很疑惑,没有自带文本编辑器,好在网上有不少成型的库可以用 我用的是ckeditor编辑器,安装和配置我引用别人的博客 这篇博客配置 ...
- Django中使用CKEditor代码高亮显示插件Code Snippet
Django使用CKEditor可以安装django-ckeditor这个模块,具体步骤可按照这里进行:http://www.nanerbang.com/article/2/ 我在富文本编辑器中想使用 ...
- 在django中集成ckeditor富文本
目前用的比较多的富文本插件有百度的ueditor.ckeditor.kindeditor等,其中ueditor和kindeditor比较美观,ckeditor的皮肤较少.但是ueditor加载较慢,k ...
- ckeditor django admin 中使用
ckeditor settings配置 ############ # CKEDITOR # ############ MEDIA_ROOT = os.path.join(BASE_DIR, 'medi ...
- django使用ckeditor上传图片
1.在模型类中设置字段为富文本类型,这里需要注意引入的是RichTextUploadingField,以允许上传图片,需要和RichTextField区分开 from ckeditor_uploade ...
- Django添加ckeditor富文本编辑器
源码 https://github.com/django-ckeditor/django-ckeditor 通过pip安装. pip3 install django-ckeditor pip3 ins ...
随机推荐
- UniGUI 之UniDBGrid(05)
UniGUI 之UniDBGrid(05) 目录1]DataSource设置2]显示MEMO类型里的文字3]显示悬浮提示4]显示当前记录及总记录数5]读取所有记录,及分页6]在前面加上序号列7]不显示 ...
- Linux系统监控 zabbix-agent 主机添加的操作页面
#!/bin/bash#设置解析#安装zabbix源.aliyun YUM源# rpm -ivh http://repo.zabbix.com/zabbix/4.0/rhel/7/x86_64/zab ...
- Centos7精简版安装常用扩展插件
一.安装ifconfig *确认本机是否真实存在ifconfig* echo $PATH 查看环境变量路径 ls /usr/sbin/ 查看此路径下是否有ifconfig这个程序 find / -na ...
- 为安卓手机刷上手机kali系统Nethunter
kali Nethunter是一个装在手机上的kali,集成了kali的工具包,hid,无线攻击等等. 本文主要叙述如何安装此系统并正确的配置.不让你走弯路. 首先我们拒绝傻瓜安装软件 kali ne ...
- 【剑指Offer面试编程题】题目1368:二叉树中和为某一值的路径--九度OJ
题目描述: 输入一颗二叉树和一个整数,打印出二叉树中结点值的和为输入整数的所有路径.路径定义为从树的根结点开始往下一直到叶结点所经过的结点形成一条路径. 输入: 每个测试案例包括n+1行: 第一行为2 ...
- canvas象棋 画图
今天写了一个canvas画图的象棋 .js基础不行,只画了个图,以后补充... <!DOCTYPE html> <html lang="en"> <h ...
- 移动端触摸touchstart监听事件
click.mousedown等事件适用于PC端,在移动端会有一定时间的延迟,所以更好的优化移动端体验,要用touch事件, 1.首先要添加一个监听事件,监听移动端行为 element.addEven ...
- (4)LoraWAN:Physical Message Formats
四.Physical Message Formats LoRa数据包结构 LoRaTM调制解调器采用隐式和显式两种数据包格式.其中,显式数据包的报头较短,主要 包含字节数.编码率及是否在数据包中使用循 ...
- oracle练习-day01
.基础查询 yearly .条件查询小于的员工 ; ;的员工; ,,); .模糊查询.排序.字符函数,) test .数值函数.,),round(.,),round(.) .,.),trunc(., ...
- Vue二次精度随笔(2)
1.vue中数组更新是否会引起视图刷新的研究 (1)vue中修改数组可以引起视图刷新的方法 (2)不会引起数组刷新的方法,需要手动进行赋值 (3)有些数组的变化是不能够引起视图的刷新的,一个是修改数组 ...