python3.6 xadmin添加DjangoUeditor富文本编辑器

Ueditor下载地址 https://github.com/twz915/DjangoUeditor3

1. 下载安装，在命令行运行：

 

 python setup.py install

2.在INSTALL_APPS里面添加配置：

 INSTALLED_APPS = (        
     #........        
    'DjangoUeditor',    
 )
 MEDIA_URL='/upload/'
 MEDIA_ROOT = os.path.join(BASE_DIR, 'blog/upload')#最后不能加斜杆，不然显示图片错误

3.在项目下的xadmin\plugins\路径下新建ueditor.py脚本,内容如下

import xadminfrom xadmin.views import BaseAdminPlugin, CreateAdminView, ModelFormAdminView, UpdateAdminViewfrom DjangoUeditor.models import UEditorFieldfrom DjangoUeditor.widgets import UEditorWidgetfrom django.conf import settingsclass 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)

4.在xadmin\plugins\路径下的init.py文件下的PLUGINS项添加ueditor

 

xadmin\plugins\__init__.py
PLUGINS = (
    ...,
    'ueditor',
)

5.更改djangoueditor的静态资源路径

 

• 在项目下的static目录下新建ueditor目录

• 把DjangoUeditor目录下的ueditor目录下的文件移动到项目的static目录下的ueditor里

6.修改urls文件

from django.conf.urls import url, include
from django.contrib import admin
import xadmin
from django.conf.urls.static import static #新增
from django.conf import settings #新增

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^xadmin/', xadmin.site.urls),
    url(r'^blog/', include('blog.urls')),
    url(r'^ueditor/', include('DjangoUeditor.urls')) #新增
]
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) #新增

7.修改app models

from DjangoUeditor.models import UEditorField
class Article(models.Model):
    """文章"""
    content = UEditorField(verbose_name='正文', height=300, width=800, default=u'',
                       blank=True, imagePath="images/", toolbars='besttome', filePath='files/')
    ...

8.adminx文件添加对应style

class ArticleAdmin(object):
    style_fields = {"content": "ueditor"} #新增
    list_display = ['id', 'title', 'author', 'create_time', 'update_time']
    search_fields = ['title']
    list_filter = ['id', 'title', 'author__username', 'create_time', 'update_time']
    list_display_links = ['title', ]

9.重启django，可以看到富文本编辑器成功应用

 

10.查看详情：http://127.0.0.1:8000/xadmin/blog/article/2/detail/

需要修改xadmin/views/detail.py 

  self.allow_tags = True