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

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

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

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

from DjangoUeditor.models import UEditorField
content=UEditorField(verbose_name='博客内容',width=700,height=400,toolbars='full',imagePath='ueditor/images/',filePath='ueditor/files/',upload_settings{'imageMaxSizing':1024000},default='')

5.xadmin中添加插件ueditor

由于已经将xadmin源文件拷贝到了项目下,为extra_apps/xadmin,在xadmin下的plugin中新建一个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.min.js") #自己的静态目录
    nodes.append(js) xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
xadmin.site.register_plugin(UeditorPlugin, CreateAdminView)

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

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

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

1.在settings里面配置

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

Django-xadmin后台配置富文本编辑器(方法一)的更多相关文章

  1. Django xadmin后台添加富文本编辑器UEditor的用法

    效果图: 步骤: 1.利用命令:pip install DjangoUeditor,安装DjangoUeditor,但由于DjangoUeditor没有python3版本的,从的Github上把修改好 ...

  2. django—xadmin中集成富文本编辑器ueditor

    一.安装 pip命令安装,由于ueditor为百度开发的一款富文本编辑框,现已停止维护,如果解释器为python2,则直接pip install djangoueditor 解压包安装,python3 ...

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

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

  4. Django配置富文本编辑器kindeditor

    一.简介 django是一个容易快速上手的web框架,用它来创建内容驱动型的网站(比如独立博客)十分方便.遗憾的是,django并没有提供官方的富文本编辑器,而后者恰好是内容型网站后台管理中不可或缺的 ...

  5. django后台集成富文本编辑器Tinymce的使用

    富文本编辑器Tinymce是使用步骤: 1.首先去python的模块包的网站下载一个django-tinymce的包 2.下载上图的安装包,然后解压,进入文件夹,执行: (pychrm直接运行命令pi ...

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

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

  7. xadmin引入django-ckeditor富文本编辑器

    一.安装: pip install django-ckeditor 安装django-ckeditor库 https://github.com/django-ckeditor/django-ckedi ...

  8. python 全栈开发,Day83(博客系统子评论,后台管理,富文本编辑器kindeditor,bs4模块)

    一.子评论 必须点击回复,才是子评论!否则是根评论点击回复之后,定位到输入框,同时加入@评论者的用户名 定位输入框 focus focus:获取对象焦点触发事件 先做样式.点击回复之后,定位到输入框, ...

  9. Django项目中添加富文本编辑器django-ckeditor

    django-ckeditor库的使用步骤: 1.在命令行下安装django-ckeditor这个库: 命令:pip install django-ckeditor 2.安装成功后,配置Django项 ...

随机推荐

  1. WebAPI接口测试数据库操作

    通常我们是不建议直接查看数据库内容来检查功能的,但是在没有外部接口或者图形界面验证的情况下,只能通过查询数据库来验证. 比如我们手工需要从界面上添加一万条数据,估计要花好几天时间,显然不能手工去操作. ...

  2. Gemini.Workflow 双子工作流高级教程:对外API控制引擎:总述

    前言: 双子工作流提供了一套对外的API,用于控制整体系统运转,下面就来看看介绍,其实很简单的. 对外API控制引擎总介: Gemini.Workflow 双子工作流,对外提供的API,都在Gemin ...

  3. 简单“三步”让你的网站支持https!

    关于Let's Encrypt Let's Encrypt作为一个公共且免费SSL的项目逐渐被广大用户传播和使用,是由Mozilla.Cisco.Akamai.IdenTrust.EFF等组织人员发起 ...

  4. RabbitMQ异常注意 reply-code=404, reply-text=NOT_FOUND - no exchange 'topic' in vhost '/', class-id=50, method-id=

    第一次,一定要先启动Provider再启动Consumer!!! rabbitmq为初始状态没有队列信息,然后我又没有启动consumer,所以导致provider找不到queue和exchange. ...

  5. 如何正确使用 Spring Cloud?【下】

    5. Spring Cloud 如何融合 DevOps? 接下来,我们来了解一下 Spring Cloud 在与 DevOps 融合方面可以做哪些事情,它是如何让应用持续交付更加快捷的?我们都知道,D ...

  6. Geoserver发布服务

    Geoserver发布服务的数据源很多样化 在数据存储中选择要发布的数据来源,这里以POSTGIS为例 1. 2.如果成功,就会读取出库里面的表,你可以在这里添加图层,发布服务 3.点击发布,进行服务 ...

  7. NestedScrollView、ScrollView 加载完自动滑动至底部问题的解决方案

    正常情况下,由于NestedScrollView/ScrollView 嵌套RecyclerView,可能会导致Recyclerview占据焦点导致整个NestedScrollView/ScrollV ...

  8. 分析Android APK- smali 语言简介

    2.1 smali 语言简介 1.smali apk文件通过apktool反编译出来的都有一个smali文件夹,里面都是以.smali结尾的文件. smali语言是Davlik的寄存器语言,语法上和汇 ...

  9. Android五大布局详解——GridLayout(网格布局)

    GridLayout 本章以一个小的实现示例讲述: 实现效果如图: 代码实现: <?xml version="1.0" encoding="utf-8"? ...

  10. 使用jeecg-boot心得

    使用jeecg-boot心得: Jeect-boot,采用主流最新的开发技术,是个强大的快速开发平台. 刚开始发现jeecg-boot时便对其精致美观的页面深深的迷住了.下载项目运行发现其中也有想要的 ...