1、安装

 安装DjangoUeditor

  1)去GitHub上面下载djangoueditor源码包(https://github.com/twz915/DjangoUeditor3)

     然后进入源码的setup.py所在目录,执行pyton setup.py install安装。

  2)直接通过pip命令安装

    pip install DjangoUeditor

 然后将DjangoUeditor放到settings文件的INSTALLED_APPS中

2、配置url

  url(r"^ueditor/", include(DjangoUeditor.urls))

3、在model中使用

  from DjangoUeditor.models import UEditorField

  field = UEditorField(verbose_name = "", width=200, height=300, imagepath="", filepath="", default="", toolbar=[[]])

  常用参数说明:

    verbose_name:字段显示名

    width/height:富文本宽高

    imagepath/filepath:图片/文件存储相对路径(相对settings中配置的MEDIA_ROOT)

    toolbar:工具栏上的功能按钮,注意这里的toolbar是嵌套的列表

4、准备工作都做好了,接下来需要在xadmin中集成调用,集成方法:

  在xadmin--->plugin中新建ueditor.py(名字自定义),内容如下:

  

import xadmin
from xadmin.views import BaseAdminPlugin, CreateAdminView, 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):
# 识别xadmin中的style_field
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 # 在生成的页面中加入自己的js文件
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.min.js")
   nodes.append(js) xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
xadmin.site.register_plugin(UeditorPlugin, CreateAdminView)

  然后在xadmin--->plugin--->__init__.py文件的PLUGINS中加入我们自定义的插件ueditor

    

  这样就完成了ueditor在xadmin中的集成

  最后,在注册modelXadmin的中,加入style_fields={"字段名":"ueditor"}

  

xadmin集成DjangoUeditor的更多相关文章

  1. django xadmin 集成DjangoUeditor富文本编辑器

    本文档记录自己的学习历程! 介绍 Ueditor HTML编辑器是百度开源的在线HTML编辑器,功能非常强大 额外功能 解决图片视频等无法上传显示问题 Ueditor下载地址 https://gith ...

  2. xadmin集成DjangoUeditor,以及编辑器的视频路径配置

    稍微讲一下DjangoUeditor的配置,因为之前去找配置的时候东拼西凑的,所以自己写一下自己一步步配置的过程.首先我是再github上去下载下来,因为是当作第三方插件集成到xadmin中,所以不用 ...

  3. 第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框

    第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框 首先安装DjangoUeditor3模块 Ueditor HTML编辑器是百度开源的HTML编辑器 下载 ...

  4. Django xadmin引入DjangoUeditor

    Django xadmin引入DjangoUeditor 版本:python3.6.1,Django1.11.1 DjangoUeditor下载地址:https://github.com/twz915 ...

  5. xadmin集成ueditor

    from DjangoUeditor.models import UEditorField content = UEditorField(u"内容", imagePath=&quo ...

  6. Xadmin集成富文本编辑器ueditor

    在xadmin中通过自定义插件,实现富文本编辑器,效果如下: 1.首先,pip安装ueditor的Django版本: pip install DjangoUeditor 2.之后需要添加到项目的set ...

  7. django2集成DjangoUeditor富文本编辑器

    富文本编辑器,在web开发中可以说是不可缺少的.django并没有自带富文本编辑器,因此我们需要自己集成,在这里推荐大家使用DjangoUeditor,因为DjangoUeditor封装了我们需要的一 ...

  8. Django使用xadmin集成富文本编辑器Ueditor(方法二)

    一.xadmin的安装与配置1.安装xadmin,其中第一种在python3中安装不成功,推荐第二种或者第三种 方式一:pip install xadmin 方式二:pip install git+g ...

  9. xadmin快速搭建后台管理系统

    一.xadmin的特点: 1.基于Bootstrap3:Xadmin使用Bootstrap3.0框架精心打造.基于Bootstrap3,Xadmin天生就支持在多种屏幕上无缝浏览,并完全支持Boots ...

随机推荐

  1. Python 常用的正则表达式

    校验数字的相关表达式: 功能 表达式 数字 ^[0-9]*$ n位的数字 ^\d{n}$ 至少n位的数字 ^\d{n,}$ m-n位的数字 ^\d{m,n}$ 零和非零开头的数字 ^(0|[1-9][ ...

  2. python之restful api(flask)获取数据

    需要用到谷歌浏览器的扩展程序 Advanced Rest Client进行模拟请求 1.直接上代码 from flask import Flask from flask import request ...

  3. The server principal "sa" is not able to access the database "xxxx" under the current security context

    在SQL Server服务器上一个作业执行时,遇到下面错误信息: Message: Executed as user: dbo. The server principal "sa" ...

  4. 在微信小程序中使用LeanCloud(一)

    之前学习了微信小程序前端,使用到LeanCloud线上数据库 [传送门].作为一个前端开发人员,了解后端及数据库是学习工作的需要. LeanCloud直接登录,未注册直接创建账户.它是一款免费的线上数 ...

  5. python第一百一十一天 --Django 6 model 的相关操作

    创建数据库,设计表结构和字段 使用 MySQLdb 来连接数据库,并编写数据访问层代码 业务逻辑层去调用数据访问层执行数据库操作 import MySQLdb def GetList(sql): db ...

  6. sql视图显示数据不对应

    出现这样的原因是修改了表的结构,没有重新编译视图,这种情况出现的几率很少,并不是没有. 解决方法:重新编译一下该视图. 视图是一个虚表,是从一个或几个基本表(或视图)中导出的表,在系统的数据字典中仅存 ...

  7. C# -- 接口 (关键字:interface)

    C#: 接口(关键字:interface) 1.代码(入门举例) class Program { static void Main(string[] args) { Console.WriteLine ...

  8. DB2常见错误信息

    000 00000 SQL语句成功完成01xxx SQL语句成功完成,但是有警告+012 01545 未限定的列名被解释为一个有相互联系的引用+098 01568 动态SQL语句用分号结束+100 0 ...

  9. @RequestParam 和@RequestBody 的区别?

    @RequestParam用来接收: 1 用来处理简单的参数绑定 2 用来接收 Content-Type 是   application/x-www-form-urlencoded (这种格 式的数据 ...

  10. 5.02-requests_proxy

    import requests # 1.请求url url = 'http://www.baidu.com' headers = { 'User-Agent': 'Mozilla/5.0 (Macin ...