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
  6. class XadminUEditorWidget(UEditorWidget):
  7. def __init__(self,**kwargs):
  8. self.ueditor_options=kwargs
  9. self.Media.js = None
  10. super(XadminUEditorWidget,self).__init__(kwargs)
  11. class UeditorPlugin(BaseAdminPlugin):
  12. def get_field_style(self, attrs, db_field, style, **kwargs):
  13. if style == 'ueditor':
  14. if isinstance(db_field, UEditorField):
  15. widget = db_field.formfield().widget
  16. param = {}
  17. param.update(widget.ueditor_settings)
  18. param.update(widget.attrs)
  19. return {'widget': XadminUEditorWidget(**param)}
  20. return attrs
  21. def block_extrahead(self, context, nodes):
  22. js = '<script type="text/javascript" src="%s"></script>' % (settings.STATIC_URL + "ueditor/ueditor.config.js")         #自己的静态目录
  23. js += '<script type="text/javascript" src="%s"></script>' % (settings.STATIC_URL + "ueditor/ueditor.all.min.js")   #自己的静态目录
  24. nodes.append(js)
  25. xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
  26. 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')

django配置Ueditor富文本编辑器的更多相关文章

  1. python3 Django集成Ueditor富文本编辑器

    1.下载 python3: https://github.com/twz915/DjangoUeditor3/ (直接下载zip) 2.解压,解压打开后找到DjangoUeditor将DjangoUe ...

  2. MVC 使用 Ueditor富文本编辑器

    一.Ueditor 1.下载Ueditor富文本编辑器 官方下载地址: http://ueditor.baidu.com/website/download.html 建议下载开发版,此处我下载的是 . ...

  3. django之百度Ueditor富文本编辑器后台集成

    Python3 + Django2.0 百度Ueditor 富文本编辑器的集成 百度富文本编辑器官网地址:http://fex.baidu.com/ueditor/ 疑问:为什么要二次集成? 答案:因 ...

  4. 百度ueditor富文本编辑器的使用

    百度ueditor富文本编辑器的使用 //以下为我在官网下载的ueditor v1.3.5 php版的大楷配置步骤第一步: //配置文件的引入应该比功能文件先引入,最后设置语言类型.即:editor. ...

  5. 前后端分离ueditor富文本编辑器的使用-Java版本

    最近在写一个自己的后台管理系统(主要是写着玩的,用来熟悉后端java的知识,目前只是会简单的写点接口),想在项目中编写一个发布新闻文章的功能,想到了使用百度的ueditor富文本编辑器,网上找了很多j ...

  6. ASP.NET MVC5 中百度ueditor富文本编辑器的使用

    随着网站信息发布内容越来越多,越来越重视美观,富文本编辑就是不可缺少的了,众多编辑器比较后我选了百度的ueditor富文本编辑器. 百度ueditor富文本编辑器分为两种一种是完全版的ueditor, ...

  7. PHP如何搭建百度Ueditor富文本编辑器

    本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下 ...

  8. UEditor富文本编辑器简单使用

    UEditor富文本编辑器简单使用 一.下载地址:https://ueditor.baidu.com/website/ 官网中并没有 python 版本的 UEditor 富文本编辑器,本文简单介绍 ...

  9. ueditor富文本编辑器使用百度地图自定义动态地图组件及兼容https及http协议

    ueditor富文本编辑器默认支持百度地图组件,但是如果导入动态地图后会加很多默认的地图组件在上面.如果需要自定义动态地图的组件则需要修改ueditor特定的html. ueditor百度地图组件所在 ...

随机推荐

  1. 重写nyoj2——括号匹配

    #include "bits/stdc++.h" using namespace std; int comp(char s1,char s2){ ; ; } int main() ...

  2. 局域网两台机器ping超时

    在防火墙的高级设置中的入站规则里,找icmpv4 ,我的两条电脑都是无线连的,看你的无线是专用还是公用,开启对应的规则. windows默认是关闭的,我的系统前些天刚重置过,ping超时,还是要手动开 ...

  3. InnoDB存储引擎介绍-(5) Innodb逻辑存储结构

    如果创建表时没有显示的定义主键,mysql会按如下方式创建主键: 首先判断表中是否有非空的唯一索引,如果有,则该列为主键. 如果不符合上述条件,存储引擎会自动创建一个6字节大小的指针. 当表中有多个非 ...

  4. 深入Spring Boot: 怎样排查 java.lang.ArrayStoreException

    java.lang.ArrayStoreException 分析 这个demo来说明怎样排查一个spring boot 1应用升级到spring boot 2时可能出现的java.lang.Array ...

  5. 牛客多校第三场 A—pacm team (4维背包加路径压缩)

    链接:https://www.nowcoder.com/acm/contest/141/A 来源:牛客网 Eddy was a contestant participating , Eddy fail ...

  6. js 获取数组重复的元素

    //获取数组重复的元素 function refrain(arr) { var tmp = []; if(Array.isArray(arr)) { arr.concat().sort().sort( ...

  7. CentOS查看安装包会释放哪些文件

    1.查看软件包全称(以mysql为例) rpm -qa | grep -i mysql 2.查看释放出的文件(以MySQL-server-5.5.55-1.el6.x86_64为例) rpm -ql ...

  8. VNC安装配置及连接(CentOS)

    1.安装VNC yum install -y tigervnc-server #安装VNC服务端,一般执行此句即可yum groupinstall -y 'X Window System' 'Desk ...

  9. MVC的前端和后端的Model Binding

    1.前端提交JSON 字符串 {"id":13,"title":"这里是标题33","day":"2018-8 ...

  10. js如何简单实现汉字转成拼音的功能

    最近项目需要一个功能,实现汉字转拼音功能,具体比如说输入一个“你好”,同时带出对应拼音“NiHao”,在此做一下记录 1.首先引入两个文件 <script src="jquery.mi ...