2019 六月 19 , 星期三
Home / 开发语言 / python / django admin 后台添加 富文本编辑器 kindeditor

django admin 后台添加 富文本编辑器 kindeditor

python admin 后台添加 富文本编辑器 kindeditor

下载http://kindeditor.net/down.php  解压放到static目录下

添加config.js


KindEditor.ready(function(K) {

function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
var csrftoken = getCookie('csrftoken');

window.editor = K.create('#id_content',{

// 指定大小
width:'600px',
minWidth:'600px',
height:'400px',
resizeType : 1,
allowPreviewEmoticons : false,
allowImageUpload : true,
uploadJson: "/admin/upload",
filePostName : 'file',
extraFileUploadParams: {csrfmiddlewaretoken:csrftoken},
items:[
'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'code', 'cut', 'copy', 'paste',
'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent',
'clearhtml', 'quickformat', 'selectall', '/',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
'insertfile', 'table', 'hr', 'emoticons', 'pagebreak',
'anchor', 'link', 'unlink'
]
});
});

编辑setting.py 添加


STATIC_URL = '/static/'

STATICFILES_DIRS = (

<em id="__mceDel">os.path.join(BASE_DIR, 'static'),
)</em>

MEDIA_URL = "http://127.0.0.1:8000/"
MEDIA_ROOT = 'static/media/'

打开admin.py 在对应的class model中添加 加在js文件(注意根据自己的目录)


class Media:
js = (
'editor/kindeditor-all-min.js',
'editor/lang/zh_CN.js',
'editor/config.js',
)

在form model 中添加对应的form  注意textarea的id属性 要对应config.js 设置的属性


class WpPostsForms(forms.ModelForm):

post_title = forms.CharField(widget=forms.TextInput(attrs={'class':'form-control'}),
max_length=50,label=u'标题',required=True)

post_content = forms.CharField(widget=forms.Textarea(attrs={'class':'form-control','id':'id_content'}),
label=u'内容',required=True)

class Meta:
model = WpPosts
fields=['post_title', 'post_content']

打开页面

django1

处理编辑器上传图片

在view.py中添加一个action


from django.http import HttpResponse,HttpResponseRedirect
from PIL import Image
from django import forms
import ImageFile
from mysite import settings
import time,os,json
from django.core.urlresolvers import reverse

def upload(request):
    if not request.user.is_authenticated():
        return HttpResponseRedirect(reverse('admin:index', args=()))
    if request.method == "POST":
        msg = {}
        f = request.FILES["file"]
        ext = ['gif', 'jpg', 'jpeg', 'png', 'bmp']
        if f.name.split('.')[-1] not in ext:
            msg["error"] = 1
            msg["url"] = ""
            msg["message"] = "上传文件格式不正确"
            return HttpResponse(json.dumps(msg))
       parser = ImageFile.Parser()
       for chunk in f.chunks():
           parser.feed(chunk)
           img = parser.close()
       path = settings.MEDIA_ROOT + str(time.strftime("%Y%m%d", time.localtime(time.time())))
       if os.path.exists(path) == False:
           os.mkdir(path)
       name = '%s%s' % (path + "/", f.name)
       img.save(name)
       msg["error"] = 0
       msg["url"] = settings.MEDIA_URL + name
       return HttpResponse(json.dumps(msg))

现在可以上传图片了

django2

Check Also

python 解决 InsecurePlatformWarning: A true SSLContext object is not available. This prevents urllib3 from configuring SSL appropriately and may cause certain SSL connections to fail. For more information

因为SSL的问题,urllib ...

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>