在整合富文本编辑器的过程中,遇到过一些问题,但是总算是好了,遇到的问题主要还是心情不太好,所有有点不知所错,开始之前也没好好分析一下问题就开始瞎弄,所以花了很长时间,现在的状态是可以在admin后台中使用富文本编辑,前台的还没写
在整个过程中,不需要做太多,只要到官网 http://www.tinymce.com/download/download.php 下载代码放到服务器上,在注册model的时候配好admin的行为就ok了,具体步骤如下
一;下载代码
刚开始使用的是tinymce_4.1.6.zip,但是过程中报很多文件找不到,就下了tinymce_3.5.11.zip版本
二;服务器目录
[root@localhost timtest2]# tree . -L 3
.
├── db.sqlite3
├── edit
│ ├── admin.py
│ ├── admin.pyc
│ ├── __init__.py
│ ├── __init__.pyc
│ ├── models.py
│ ├── models.pyc
│ ├── tests.py
│ └── views.py
├── manage.py
├── media
│ └── js
│ ├── textareas.js
│ ├── textareas.js.bak
│ ├── tiny_mce #这是提取出来的代码
│ └── tinymce_3.5.11.zip
└── timtest2
├── __init__.py
├── __init__.pyc
├── settings.py
├── settings.pyc
├── urls.py
├── urls.pyc
├── wsgi.py
└── wsgi.pyc
[root@localhost js]# tree tiny_mce/ -L 1
tiny_mce/
├── langs
├── license.txt
├── plugins
├── themes
├── tiny_mce.js
├── tiny_mce_popup.js
├── tiny_mce_src.js
└── utils
三;models.py 文件
[root@localhost edit]# more models.py
from django.db import models
from django.contrib import admin
# Create your models here.
class Blog(models.Model):
pub_date = models.DateField()
headline = models.CharField(max_length=200)
content = models.TextField()
class BlogAdmin(admin.ModelAdmin):
class Media:
js = (
'/media/js/tiny_mce/tiny_mce.js',
'/media/js/textareas.js',
)
[root@localhost edit]#
四:admin.py 文件
[root@localhost edit]# more admin.py
from django.contrib import admin
# Register your models here.
import models
admin.site.register(models.Blog,models.BlogAdmin)
[root@localhost edit]#
五:textareas.js 文件
[root@localhost js]# more textareas.js
tinyMCE.init({
// General options
mode : "textareas",
theme : "advanced",
plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fulls
creen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave",
// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselec
t,fullscreen,code",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,|,insertdate,inserttim
e,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
// Example content CSS (should be your site CSS)
//content_css : "/css/style.css",
template_external_list_url : "lists/template_list.js",
external_link_list_url : "lists/link_list.js",
external_image_list_url : "lists/image_list.js",
media_external_list_url : "lists/media_list.js",
// Style formats
style_formats : [
{title : 'Bold text', inline : 'strong'},
{title : 'Red text', inline : 'span', styles : {color : '#ff0000'}},
{title : 'Help', inline : 'strong', classes : 'help'},
{title : 'Table styles'},
{title : 'Table row 1', selector : 'tr', classes : 'tablerow'}
],
width: '700',
height: '400'
});
[root@localhost js]#
六:urls.py 文件
[root@localhost timtest2]# more urls.py
from django.conf.urls import patterns, include, url
from django.contrib import admin
admin.autodiscover()
urlpatterns = patterns('',
# Examples:
# url(r'^$', 'timtest2.views.home', name='home'),
# url(r'^blog/', include('blog.urls')),
(r'^media/(?P<path>.*)$', 'django.views.static.serve',{'document_root': 'media'}),
url(r'^admin/', include(admin.site.urls)),
)
[root@localhost timtest2]#
可以通过1270.0.1/media/js/textareas.js 访问到文件
七:settings.py文件
[root@localhost timtest2]# more settings.py
"""
Django settings for timtest2 project.
For more information on this file, see
https://docs.djangoproject.com/en/1.6/topics/settings/
For the full list of settings and their values, see
https://docs.djangoproject.com/en/1.6/ref/settings/
"""
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
import os
BASE_DIR = os.path.dirname(os.path.dirname(__file__))
# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/1.6/howto/deployment/checklist/
# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = '4vid)wp*w-6%+am9p*zww&wn2cfetjodjo)6c-*dojn)e1xa+l'
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
TEMPLATE_DEBUG = True
ALLOWED_HOSTS = []
# Application definition
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'edit',
)
MIDDLEWARE_CLASSES = (
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
)
ROOT_URLCONF = 'timtest2.urls'
WSGI_APPLICATION = 'timtest2.wsgi.application'
# Database
# https://docs.djangoproject.com/en/1.6/ref/settings/#databases
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.sqlite3',
'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
}
}
# Internationalization
# https://docs.djangoproject.com/en/1.6/topics/i18n/
LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_I18N = True
USE_L10N = True
USE_TZ = True
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.6/howto/static-files/
STATIC_URL = '/static/'
[root@localhost timtest2]#
没有改过
效果演示
参考资源:
http://imtx.me/archives/215.html
让Django支持富文本编辑器:Tiny_mce篇
http://sleepycat.org/blog/25/
Django Admin 使用 TinyMCE 富文本编辑器
http://www.wutianqi.com/?p=3312Django后台整合TinyMCE富文本编辑器 这个厉害
http://my.oschina.net/zhajiang/blog/56814 这个讲解的比较全