django xadmin集成Ueditor富文本编辑器

python2的网址下载包https://github.com/zhangfisher/DjangoUeditor

python3的网址下载包https://github.com/twz915/DjangoUeditor3

下载后解压后进入目录


进入虚拟环境后执行命令 python setup.py install   就安装完毕了


在setting.py中配置app


在项目的urls下配置

# 富文本相关url
url(r'^ueditor/',include('DjangoUeditor.urls' )),
在model中导入
from DjangoUeditor.models import UEditorField

使用(详细使用看上面两个网址)

detail = UEditorField(verbose_name='课程详情    ', width=600, height=300,
                         imagePath="course/ueditor/", filePath="course/ueditor/",default='')

在xadmin下的plugins中添加ueditor.py

该文件代码为

#!/usr/bin/python3
# -*-coding:utf-8-*-

import xadmin
from xadmin.views import BaseAdminPlugin, CreateAdminView, ModelFormAdminView, UpdateAdminView
from DjangoUeditor.models import UEditorField
from DjangoUeditor.widgets import UEditorWidget
from django.conf import settings


class XadminUEditorWidget(UEditorWidget):
    def __init__(self, **kwargs):
        self.ueditor_options = kwargs
        self.Media.js = None
        super(XadminUEditorWidget, self).__init__(kwargs)


class UeditorPlugin(BaseAdminPlugin):
    def get_field_style(self, attrs, db_field, style, **kwargs):
        if style == 'ueditor':
            if isinstance(db_field, UEditorField):
                widget = db_field.formfield().widget
                param = {}
                param.update(widget.ueditor_settings)
                param.update(widget.attrs)
                return {'widget': XadminUEditorWidget(**param)}
        return attrs

    def block_extrahead(self, context, nodes):
        js = '<script type="text/javascript" src="%s"></script>' % (
            settings.STATIC_URL + "ueditor/ueditor.config.js")  # 自己的静态目录
        js += '<script type="text/javascript" src="%s"></script>' % (
            settings.STATIC_URL + "ueditor/ueditor.all.js")  # 自己的静态目录
        nodes.append(js)


xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
xadmin.site.register_plugin(UeditorPlugin, CreateAdminView)

在plugins下的__init__.py中加入


在adminx中加入

style_fields = {"detail":"ueditor"}

detail是字段名

这样就配置完毕





猜你喜欢

转载自blog.csdn.net/pzl_pzl/article/details/80805212