CKEditor

  富文本即具备丰富样式格式的文本。在运营后台,运营人员需要录入课程的相关描述,可以是包含了HTML语法格式的字符串。为了快速简单的让用户能够在页面中编辑带格式的文本,我们引入富文本编辑器。

1. 安装

pip install django-ckeditor

2.在INSTALLED_APPS中添加

INSTALLED_APPS = [
...
'ckeditor', # 富文本编辑器
'ckeditor_uploader', # 富文本编辑器上传图片模块
...
]

3. 添加CKEditor设置

在settings/dev.py中添加

# 富文本编辑器ckeditor配置
CKEDITOR_CONFIGS = {
'default': {
'toolbar': 'full', # 工具条功能
'height': 300, # 编辑器高度
# 'width': 300, # 编辑器宽
},
}
CKEDITOR_UPLOAD_PATH = '' # 上传图片保存路径

4. 添加ckeditor路由

在总路由中添加

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

5. 为模型类添加字段

ckeditor提供了两种类型的Django模型类字段

  • ckeditor.fields.RichTextField  不支持上传文件的富文本字段

  • ckeditor_uploader.fields.RichTextUploadingField  支持上传文件的富文本字段\

修改course/models.py里面的字段信息,记得要重新数据迁移

from ckeditor_uploader.fields import RichTextUploadingField
class Course(models.Model):
"""
专题课程
"""
... brief = RichTextUploadingField(max_length=2048, verbose_name="课程概述", null=True, blank=True)

CKEditor富文本编辑器的更多相关文章

  1. 项目页面集成ckeditor富文本编辑器

    步骤一.引入ckeditor.js (注:本实例以ThinkPHP3.2框架为载体,不熟悉ThinkPHP的朋友请自行补习,ckeditor文件代码内容也请去ckeditor官网自行下载) 作为程序员 ...

  2. django中ckeditor富文本编辑器使用

    1.安装模块 (pillow是python的一个图像处理库) pip install django-ckeditor pip install pillow 2.编辑seetings.py配置文件 IN ...

  3. day82:luffy:课程详情页面显示&章节和课时显示&视频播放组件&CKEditor富文本编辑器

    目录 1.初始课程详情页面 2.视频播放组件 3.课程详情页面后端接口实现 4.课程详情页面-前端 5.CKEditor富文本编辑器 6.课程章节和课时显示-后端接口 7.课程章节和课时显示-前端 1 ...

  4. 搭建自己的博客(十三):为博客后台添加ckeditor富文本编辑器

    使用django默认的编辑器感觉功能太少了,所以集成一下富文本编辑器. 1.安装和使用 (1).安装 pip install django-ckeditor (2).注册应用 在django的sett ...

  5. ckeditor富文本编辑器的使用和图片上传,复制粘贴图片上传

    自动导入Word图片,或者粘贴Word内容时自动上传所有的图片,并且最终保留Word样式,这应该是Web编辑器里面最基本的一个需求功能了.一般情况下我们将Word内容粘贴到Web编辑器(富文本编辑器) ...

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

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

  7. ckeditor富文本编辑器的基本配置设置:

    原文地址:http://blog.csdn.net/wei365456yin/article/details/54618970?locationNum=5&fps=1 1.首先下载ckedit ...

  8. PHP ckeditor富文本编辑器 结合ckfinder实现图片上传功能

    一:前端页面代码 <script src="/www/res/ckeditor/ckeditor.js"></script> <textarea id ...

  9. Extjs整合CKEditor富文本编辑器插件

    CKEditor插件官方下载地址: http://ckeditor.com/download/releases 我使用的版本是 ExtJS5.1.0  CKEditor4.4.8 参考文章: http ...

随机推荐

  1. 添加一个Activity

    #Android中增加一个Activity 1. 在AndroidManifest.xml中增加: <activity android:name="com.example.NewAct ...

  2. Linux常用总结

    CentOS 7.0中一个最主要的改变,就是切换到了systemd.它用于替代红帽企业版Linux前任版本中的SysV和Upstart,对系统和服务进行管理.systemd兼容SysV和Linux标准 ...

  3. hadoop执行 报错

    Error: java.io.IOException: Initialization of all the collectors failed. Error in last collector was ...

  4. 第二章 函数和window对象

    1.什么是函数函数相当于Java中的方法,每一个函数可以做一件事情,但是不属于某一个类 2.使用函数的好处:使代码模块化,功能分工明确,方便调用,思路功能清晰 3.函数的分类:(1)系统函数:系统提前 ...

  5. 灵雀云率先成为 Linux 基金会/CNCF官方认证培训合作伙伴

    近日,灵雀云Alauda成为Linux基金会/CNCF授权培训伙伴项目( Linux Foundation Authorized Training Partner Program,以下简称ATP)在国 ...

  6. VCS

    timing check相关的, +notimingcheck命令,可以用在compile时,也可以用在run time的时候, 都是将检查timing的系统函数,都disable掉了, 加在comp ...

  7. 【2】Kali之情报搜集技术

    渗透测试中情报搜集需要完成两项重要任务: 1.通过信息搜集工作,确定渗透测试目标范围. 2.通过情报信息搜集,发现渗透测试目标的安全漏洞与脆弱点,为后续的渗透攻击提供基础. 通过DNS和IP地址挖掘目 ...

  8. jdk1.8新特性之lambda表达式及在Android Studio中的使用举例

    Jdk1.8已经出很久了但是很多同学对它的特性在android studio 中的应用可能还不是很熟悉,今天我们就来对这个新特性在AS中做它的应用实践. 一.首先在有JDK1.8的情况下我们要在AS的 ...

  9. 常见的python的unittest用法

    python的unittest好处是通过python脚本编写用例,每个用例可以单独调试初始化和清理动作,因为都是用例都是代码所以调试起来也很方便:它的缺点是得先学会python,难易程度见仁见智吧,对 ...

  10. openvpn 初步使用

    服务端:Centos 7.2 openvpn 2.4.3 客户端:Windows 10 安装包 openvpn的官网在国内访问不了,服务端通过yum安装,客户端在第三方网站下载的 一般的国内源应该都包 ...