xadmin集成DjangoUeditor编辑器

1.富文本编辑器

pip install DjangoUeditor

2. 在settings中进行如下配置

INSTALLED_APPS =
'DjangoUeditor',



#富文本配置
UEDITOR_SETTINGS = {"toolbars": {  # 定义多个工具栏显示的按钮,允行定义多个
    "name1": [['source', '|', 'bold', 'italic', 'underline']],
    "name2": []
},
    "images_upload": {"allow_type": "jpg,png",  # 定义允许的上传的图片类型
                      "max_size": "0"  # 定义允许上传的图片大小,0代表不限制
                      },
    "files_upload": {"allow_type": "zip,rar",  # 定义允许的上传的文件类型
                     "max_size": "0"  # 定义允许上传的文件大小,0代表不限制
                     },
    "image_manager": {"location": ""  # 图片管理器的位置,如果没有指定,默认跟图片路径上传一样
                      },
}


3.配置urls
path(r'^ueditor/', include('DjangoUeditor.urls')),

4.配置adminx.py
class GoodsAdmin(object):
    style_fields = {"allimg": "ueditor"}
xadmin.site.register(Goods,GoodsAdmin)

5.在xadmin/plugins下新建ueditor.py
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)

6.在xadmin/plugins/__init__.py添加ueditor
'ueditor'


7.在models下添加ueditor项
from DjangoUeditor.models import UEditorField

allimg = UEditorField(verbose_name='商品详情', height=400, width=700, default=u'',
                          imagePath="arts/Y/m/", toolbars='full', filePath='file/Y/m/',
                          upload_settings={"imageMaxSize": 2048000}, settings={}, command=None, )

8.将djangoueditor下的static文件复制到应用下的static
9.页面中显示富文本
{% autoescape off %}
{{ item.allimg }}
{% endautoescape %}

解决常见报错问题:
1. No module named 'widgets'
经查发现,DjangoUeditor是基于Python 2.7的,对Python3的支持有问题。导致widgets.py文件出错,不能import。解决方法为修改widgets.py或者采用网上修改好的版本DjangoUeditor3
下载地址: https://github.com/twz915/DjangoUeditor3

2. render() got an unexpected keyword argument 'renderer'
在包里找到 site-packages/django/forms/boundfield.py
找到93行注释掉 #renderer=self.form.renderer,
posted @ 2019-11-26 11:20  夜色下的景色  阅读(308)  评论(0)    收藏  举报