稍微讲一下DjangoUeditor的配置,因为之前去找配置的时候东拼西凑的,所以自己写一下自己一步步配置的过程。首先我是再github上去下载下来,因为是当作第三方插件集成到xadmin中,所以不用pip安装,直接和xadmin放一个目录就ok了。

然后是在项目的设置里面进行配置,在INSTALLED_APPS中申明DjangoUeditor的存在,

这两步做完之后就找到xadmin的plugins目录,在目录下新建一个ueditor.py的文件,其中的代码如下:

#!/usr/bin/env python
# -*- coding:utf-8 -*- 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)
然后在同一目录下找到__init__.py文件,在插件中申明ueditor插件的存在:

这样就将DjangoUeditor集成到xadmin当中了,接着就是使用的过程了,在模板中针对想要使用Ueditor编辑的字段,将其设置为UEditorField,然后进行相应的一些配置就可以了,其中包括了视频上传路径配置,只要再upload_settings中申明就可以了:
content = UEditorField(verbose_name='内容', width=600, height=300, toolbars='full',
imagePath='guide/images/', filePath='', upload_settings={'imageMaxSize': 1204000,
'videoPathFormat': "guide/videos/%(basename)s_%(datetime)s.%(extname)s"}, default='')
后再该app目录的adminx.py文件中对相应字段进行申明:
class GuideWordAdmin(object):
style_fields = {'content': 'ueditor'} xadmin.site.register(GuideWord, GuideWordAdmin)
打开后台,登陆之后就可以使用富文本编辑器了。
关于上传路径的配置,如果希望在上传的图片或视频之前加入前缀,可以在项目的setting中进行配置,比如我想直接拿资源,但是上传路径是不带有前缀的,所以资源只有一个文件路径,而不是一个可直接使用的URL资源,加上前缀之后只要文件路径是正确的,你就可以在自己的服务器下面直接输入域名查看相应文件了:

UEDITOR_SETTINGS = {
'config': { },
'upload': {
"imageUrlPrefix": "http://127.0.0.1:8000",
"videoUrlPrefix": "http://127.0.0.1:8000",
"fileUrlPrefix": "http://127.0.0.1:8000",
}
}

xadmin集成DjangoUeditor,以及编辑器的视频路径配置的更多相关文章

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

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

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

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

  3. xadmin集成DjangoUeditor

    1.安装 安装DjangoUeditor 1)去GitHub上面下载djangoueditor源码包(https://github.com/twz915/DjangoUeditor3)   然后进入源 ...

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

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

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

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

  6. AngularJS集成富文本编辑器

    最近在Angular中需要集成富文本编辑器,本来已经集成好百度的UEditor,后台觉得配置太多,让我弄个别的,然后就找到了wangEditor,这个配置和上手都要简单一些,下面来看看具体操作步骤吧: ...

  7. vue2.0集成百度UE编辑器,上传图片报错!!!

    我这边配置进去之后,界面加载,文本输入都没有问题,就是上传图片会有问题 这张图, 左边红色框框 就是目录结构咯, 右边红色框框 就是各种网上教程给出的第一个路径配置对吧, 下面的就是绿色 服务器接口配 ...

  8. Django xadmin引入DjangoUeditor

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

  9. macOS如何正确驱动集成显卡HDMI(包括视频和音频)

    聊聊如何正确驱动集成显卡HDMI(包括视频和音频)必备条件:1.必须使用AppleHDA驱动声卡(仿冒.clover.applealc都可以的),使用voodoo驱动声卡应该不行的.2.dsdt或者s ...

随机推荐

  1. WebGL学习笔记(十三):拾取

    目前为止,我们还没有涉及到交互相关的内容,实际上,我们是需要知道我们点击的地方下面的第一个物体的信息,这个过程称为拾取. 简单拾取实现 我们可以通过颜色来获取是否成功点击,具体方式如下: 场景中有一个 ...

  2. 【HBase】HBase 单机版安装及使用

    HBase介绍 HBase是一个分布式的.面向列的开源数据库,该技术来源于 Fay Chang 所撰写的Google论文“Bigtable:一个结构化数据的分布式存储系统”.就像Bigtable利用了 ...

  3. springboot docker 部署

    1.新建一个最简单的springboot项目 https://code.aliyun.com/859143303/hello-world.git 2.src/main/docker下新建Dockerf ...

  4. LeetCode_448. Find All Numbers Disappeared in an Array

    448. Find All Numbers Disappeared in an Array Easy Given an array of integers where 1 ≤ a[i] ≤ n (n  ...

  5. excel 去掉 空单元格

    Excel 2003 选中这一列,定位(CTRL+G)--定位条件--空值--确定--右键--删除. 1. 然后进行全选已输入的内容,可以使用鼠标拖动已输入的内容,也可以使用快捷键全选内容,按住ctr ...

  6. PHP设计模式 - 访问者模式

    访问者模式是一种行为型模式,访问者表示一个作用于某对象结构中各元素的操作.它可以在不修改各元素类的前提下定义作用于这些元素的新操作,即动态的增加具体访问者角色. 访问者模式利用了双重分派.先将访问者传 ...

  7. 【剑指offer】1+….+n,不能使用相关关键字

    题目描述 求1+2+3+...+n,要求不能使用乘除法.for.while.if.else.switch.case等关键字及条件判断语句(A?B:C). 分析:可以使用递归! class Soluti ...

  8. 【剑指offer】链表中的倒数第k个结点

    输入一个链表,输出该链表中倒数第k个结点. 分析: 定义两个结点p1和p2都指向头节点,p1先走k-1步,然后p1和p2一起走,当p1走到链表尾部时,p2指向的结点就是倒数第k个结点 遍历一遍链表即可 ...

  9. 小白的C++之路——简易计算机

    #include <iostream> using namespace std; int main() { char link; double num1, num2,num3; cout ...

  10. day08——文件操作

    day08 文件操作: open() :打开 f (文件句柄)= open("文件的路径(文件放的位置)",mode="操作文件的模式",encoding=&q ...