django配置Ueditor富文本编辑器

1.https://github.com/twz915/DjangoUeditor3下载包,进入包文件夹,找到DjangoUeditor包拷贝到项目下,和xadmin同级目录

 

2.找到项目的settings文件,注册app

 

3.找到项目urls文件,配置DjangoUeditor路由

 

4.找到app下的models,在须要使用富文本框的字段使用UEditorField,相关参数含义可参考文档:https://github.com/zhangfisher/DjangoUeditor

[python] view plain copy

1. from DjangoUeditor.models import UEditorField  

[python] view plain copy

1. content=UEditorField(verbose_name='博客内容',  
2. width=700,  
3. height=400,  
4. toolbars='full',  
5. imagePath='ueditor/images/',  
6. filePath='ueditor/files/',  
7. upload_settings={'imageMaxSizing':1024000},  
8. default='')  

5.xadmin中添加插件ueditor

因为已经将xadmin源文件拷贝到了项目下，为extra_apps/xadmin，在xadmin下的plugin中新建一个ueditor.py文件,添加如下代码:

[python] view plain copy

1. import xadmin  
2. from xadmin.views import BaseAdminPlugin, CreateAdminView, ModelFormAdminView, UpdateAdminView  
3. from DjangoUeditor.models import UEditorField  
4. from DjangoUeditor.widgets import UEditorWidget  
5. from django.conf import settings  
8. class XadminUEditorWidget(UEditorWidget):  
9. def __init__(self,**kwargs):  
10. self.ueditor_options=kwargs  
11. self.Media.js = None  
12. super(XadminUEditorWidget,self).__init__(kwargs)  
15. class UeditorPlugin(BaseAdminPlugin):  
17. def get_field_style(self, attrs, db_field, style, **kwargs):  
18. if style == 'ueditor':  
19. if isinstance(db_field, UEditorField):  
20. widget = db_field.formfield().widget  
21. param = {}  
22. param.update(widget.ueditor_settings)  
23. param.update(widget.attrs)  
24. return {'widget': XadminUEditorWidget(**param)}  
25. return attrs  
27. def block_extrahead(self, context, nodes):  
28. js = '<script type="text/javascript" src="%s"></script>' % (settings.STATIC_URL + "ueditor/ueditor.config.js")         #本身的静态目录  
29. js += '<script type="text/javascript" src="%s"></script>' % (settings.STATIC_URL + "ueditor/ueditor.all.min.js")   #本身的静态目录  
30. nodes.append(js)  
32. xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)  
33. xadmin.site.register_plugin(UeditorPlugin, CreateAdminView)  

6.将ueditor插件添加到plugins中的__init__.py的PLUGINS中

 

7.找到app下的adminx.py文件,配置插件

 

在页面上要取消转义

 

8.配置上传文件的加载路径

1.在settings里面配置

[python] view plain copy

1. MEDIA_URL='/media/'  
2. MEDIA_ROOT=os.path.join(BASE_DIR,'media')  

[python] view plain copy

1. 在settings里面配置  
2. from django.views.static import serve  
3. 在urls里面配置  
4. url(r'^media/(?P<path>.*)$',serve,{"document_root":settings.MEDIA_ROOT},name='media')