Django实现的博客系统中使用富文本编辑器ckeditor
操作系统为OS X 10.9.2,Django为1.6.5.
1.下载和安装
1.1 安装 ckeditor
下载地址 https://github.com/shaunsephton/django-ckeditor ,下载后进入目录安装
django-ckeditor-master bamboo$ sudo python setup.py install
1.2 安装 Pillow
django-ckeditor-master bamboo$ easy_install Pillow
sudo ARCHFLAGS=-Wno-error=unused-command-line-argument-hard-error-in-future easy_install Pillow
2.在Django中进行配置
setting.py 文件
添加 ckeditor 到 INSTALLED_APPS 中
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'aaa', # 添加应用aaa
'bob', # 添加应用bbb
'ckeditor', # 添加应用富文本编辑器 ckeditor
)
static 和 media 的路径设置
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static') MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
CKEDITOR_UPLOAD_PATH = os.path.join(MEDIA_ROOT, 'ckeditor/uploads')
CHEDITOR_UPLOAD_PATH 指定通过ckeditor所上传的文件的存放目录。
2.1 在admin中看到编辑页面
urls.py 文件中,设置ckeditor的url
url(r'^ckeditor/', include('ckeditor.urls')), # 引入ckeditor
models.py 文件中
from django.db import models
from ckeditor.fields import RichTextField class Article(models.Model):
'''日志'''
title = models.CharField(verbose_name='标题', max_length=150, blank=False, null=False)
content = RichTextField('正文') # 使用ckeditor中的RichTextField
配置完成后,即可在admin的页面中看到富文本编辑器的界面

2.2 在前台页面中看到ckeditor界面
将安装目录中的ckeditor 复制到static中
static bamboo$ cp -ri /Library/Python/2.7/site-packages/django_ckeditor_updated-4.2.8-py2.7.egg/ckeditor/static/* /Users/workspace/myblog/static/
在 write.html页面中添加JS
<script type="text/javascript" src="/static/ckeditor/ckeditor/ckeditor.js"></script>
在显示页面view.html中添加 safe 标签
{{ article.content|safe }}
参考资料:
基于django的博客系统如何完美地使用富文本编辑器ckeditor? http://www.nanerbang.com/article/2/
关于在django下使用ckeditor的步骤和技巧 http://blog.163.com/zhulp0372@yeah/blog/static/115894479201172422439697/
Django实现的博客系统中使用富文本编辑器ckeditor的更多相关文章
- Django后台管理admin或者adminx中使用富文本编辑器
在admin或者adminx后台中使用富文本编辑器 一.建立模型:(安装django-tinymce==2.6.0) from django.db import models from tinymce ...
- Django中使用富文本编辑器Uedit
Uedit是百度一款非常好用的富文本编辑器 一.安装及基本配置 官方GitHub(有详细的安装使用教程):https://github.com/zhangfisher/DjangoUeditor 1. ...
- flask项目中使用富文本编辑器
flask是一个用python编写的轻量级web框架,基于Werkzeug WSGI(WSGI: python的服务器网关接口)工具箱和Jinja2模板,因为它使用简单的核心,用extension增加 ...
- 在MVC3中使用富文本编辑器:KindEditor的配置及上传图片
现在比较常用的富文本编辑挺多的,如ueditor.fckeditor.kingeditor等,本文主要介绍一下KindEditor的配置与使用. 先去官网http://www.kindsoft.net ...
- ASP.NET MVC 5 中 使用富文本编辑器 Ueditor
一.Ueditor插件下载自:http://ueditor.baidu.com/website/ 二.将解压文件目录ueditor复制到项目根目录后, 修改以下几个文件配置: 1.访问路径配置:ued ...
- Django:(博客系统)使用使用mysql数据->后台管理tag/post/category的配置
Django后台一般是不需要人为的去开发的,因为django已经通过配置实现哪些模块是后台需要管理,如何排序,列表展示哪些列,列显示名称,是否为空(默认值),过滤条件,分页页数,列表中哪些项可编辑等等 ...
- Django快速搭建博客系统
Django快速搭建博客系统 一.开发环境 Windows 7(64bit) python 3.6 https://www.python.org/ Django 2.0 https://www. ...
- Django使用富文本编辑器
1.下载kindeditor 网址:http://kindeditor.net/demo.php2.解压到项目中 地址:\static\js\kindeditor-4.1.103.删除没用的文件 例如 ...
- django-应用中和amdin使用富文本编辑器kindeditor
文章描述.新闻详情和产品介绍等,都需要大量的文字描述信息或图片.视频.文字的编辑等,这个时候我们就需要介绍第三方富文本编辑器. 今天介绍的是django中绑定和应用kindeditor编辑器: 效果如 ...
随机推荐
- python:加密模块
加密:import hashlib # import md5 #python2 中可以直接引入md5,3中没有 #md5 #md5加密是不可逆的,即不能解密. #只要用MD5加密,结果都是一样的,不区 ...
- ext笔记
命名 The top-level namespaces and the actual class names should be CamelCased. Everything else shoul ...
- PAT 乙级 1009
题目 题目地址:PAT 乙级 1009 题解 本题本身属于比较简单的字符串操作题,但是因为对于string的操作和函数不熟悉导致本题做起来很费劲,需要加强对于string类以及相关方法的理解和熟练程度 ...
- fshc之请求仲裁机制(from mcu and cache)
1.arbiter模块本身放在sclk时钟域,但是输入都是来之HCLK时钟域. 2.当MCU/CACHE访问FSHC时,FSHC不接受其他请求,FSHC只可以同时处理一个请求的操作. 3.如果原子操作 ...
- 【mysql】配置 选项文件
在Windows中,MySQL程序从以下文件读取启动选项: 文件名 目的 WINDIR\my.ini 全局选项 C:\my.cnf 全局选项 INSTALLDIR\my.ini 全局选项 defaul ...
- 力扣题目汇总(反转字符串中的单词,EXCEL表列序号,旋置矩阵)
反转字符串中的单词 III 1.题目描述 给定一个字符串,你需要反转字符串中每个单词的字符顺序,同时仍保留空格和单词的初始顺序. 示例 1: 输入: "Let's take LeetCode ...
- foxmial 和 outlook设置问题
您可以使用支持POP3的客户端软件(例如Foxmail或Outlook)收发您的邮件.请配置您的电子邮件客户端,以下载QQ邮箱邮件. 了解如何进行配置,请单击您的电子邮件客户端名称: Foxmail设 ...
- 03006_Servlet简介
1.什么是Servlet (1)Servlet 运行在服务端的Java小程序,是sun公司提供一套规范(接口),用来处理客户端请求.响应给浏览器的动态资源: (2)Servlet的实质就是java代码 ...
- 引用类型(JavaScript第5章)
引用类型的值(对象)是引用类型的一个实例.在ECMScript中,引用类型是一种数据结构,用于将数据和功能组织在一起. 一.Object类型 创建Object实例的方式有两种.第一种是使用new操作符 ...
- luogu1129 [ZJOI2007]矩阵游戏
其实,只用考虑某一行能否放到某一行就行了 #include <iostream> #include <cstring> #include <cstdio> usin ...