django中嵌入百度editor插件
一、安装和配置步骤:
1、先下载百度ueditor插件,并安装pip install DjangoUeditor
2、把下载好的ueditor插件放到自己的项目中
3、配置setting
INSTALLED_APPS = ( 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'Web', 'DjangoUeditor', )
4、配置url
urlpatterns = [ url(r'^admin/', include(admin.site.urls)), # url(r'^ueditor/',include('DjangoUeditor.urls' )), url(r'^ueditor/',include(DjangoUeditor_urls)),
5、启动你的项目,进入django后台,即可看到百度插件编辑器
二、在项目的form中嵌入百度插件
1、确保你下载的百度插件已经放到你的项目中,如statics目录下的pugins目录中
2、在前端中加入渲染插件脚本(form)
<div id=id_content name="content" class="edui-default" style="display: inline-block;" > <div id="edui1" class="edui-editor edui-default"style="width: 1000px; z-index: 999;"> {{ form|safe }} </div> </div>
3、在前端中加入以下(js)
<script type="text/javascript"> var id_content = UE.getEditor('id_content',{'toolbars': [['source', 'undo', 'redo', 'bold', 'italic', 'underline', 'forecolor', 'backcolor', 'superscript', 'subscript', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist', 'insertunorderedlist', 'blockquote', 'formatmatch', 'removeformat', 'autotypeset', 'inserttable', 'pasteplain', 'wordimage', 'searchreplace', 'map', 'preview', 'fullscreen'], ['insertcode', 'paragraph', 'fontfamily', 'fontsize', 'link', 'unlink', 'insertimage', 'insertvideo', 'attachment', 'emotion', 'date', 'time']], 'initialFrameWidth': 1000, 'initialFrameHeight': 300, 'serverUrl': '/ueditor/controller/?imagePathFormat=uploads%2Fimages%2F&filePathFormat=uploads%2Ffiles%2F'}); id_content.ready(function(){ }); </script>
注意:一般js放到页面底部,这样可以减轻前端的加载速度,页面响应速度较快
django中嵌入百度editor插件的更多相关文章
- 网页中嵌入百度地图报错:The request has been blocked,the content must served over Https
网页中嵌入百度地图 1.进入百度地图开发平台:http://lbsyun.baidu.com/index.php?title=jspopular 2.获取密钥:http://lbsyun.baidu. ...
- pc网页中嵌入百度地图
pc网页中嵌入百度地图 1 打开百度地图生成器: http://api.map.baidu.com/lbsapi/creatmap/ 2 设置好了之后,点击获取代码,将代码粘贴到文件中保存为html文 ...
- 在ionic/cordova中使用百度地图插件
在ionic项目中,如果想实现定位功能,可以使用ng-cordova提供的cordova-plugin-geolocation. 但由于高墙的缘故,国内andorid环境下,此插件不起作用(ios环境 ...
- 在Eclipse中使用Propertites Editor插件来解决property文件中文显示乱码
在一般情况下,propertites文件在eclipse中的显示中文一直显示乱码,想要解决这个问题,需要通过在eclipse中安装一个Propertites Editor插件来进行解决. 在Eclip ...
- C# 程序中嵌入百度地图
本例是对WinForm中使用百度地图的简要介绍.百度地图目前支持Android开发,IOS开发,Web开发,服务接口,具体可以参照'百度地图开放平台'. [动态加载百度地图]涉及到的知识点: WebB ...
- [ json editor] 如何在网页中使用Json editor 插件
[目的] 在自己的网页上交由用户进行json的可视化编辑 [难点]1.json中含有递归嵌套的数组和对象 2.json中的基本值类型有数字.字符串和布尔型 [方法]使用daviddurman的Flex ...
- 使用CKplayer插件在网页中嵌入视频的方法(常用笔记2)
在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...
- C#开发ActiveX插件-aspx中嵌入
刚到新的公司,第一周让我熟悉一下他们用的silverlight和arcgis.这周,也就是昨天分配了我一个小小的任务! 哪个项目的不知道,是让我实现一个在aspx中嵌入activeX插件! 在网上找了 ...
- 【CKplayer】使用CKplayer插件在网页中嵌入视频的方法
在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...
随机推荐
- RestSharp用法小结
今天有空,小结一下RestSharp的用法. RestSharp内置了XML和JSON的反序列化(deserializers ). application/json – JsonDeserialize ...
- HTML&CSS布局练习---360导航页面
一共分为7个部分:由HTML和CSS外部样式表做成 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- Redhat系列Linux的基础命令
为网卡配置静态IP地址vi /etc/sysconfig/network-scripts/ifcfg-eth0DEVICE=eth0ONBOOT=yesBOOTPROTO=staticHWADDR=0 ...
- 《GK101任意波发生器》升级固件发布(版本:1.0.2.build126)
一.固件说明: 硬件版本:0,logic.3 固件版本:1.0.2.build126 编译日期:2014-08-23 ====================================== 二. ...
- MySql之触发器【过度变量 new old】
trigger是由事件触发某个操作.这些事件包括insert语句.update语句和delete语句.当数据库执行这些事件时,就会激活触发器执行相应的操作. [1]只有一个执行语句 create tr ...
- sqlite相关工具使用
sqlite3可视化工具 1.sudo apt-get install sqlitebrowser 2.sudo apt-get install sqliteman3.sqlitestudio需要去官 ...
- 常用的PHP数据库操作方法(MYSQL版)
常用的PHP数据库操作方法(MYSQL版) 作者: 字体:[增加 减小] 类型:转载 时间:2011-06-08 最近一直在折腾自己的网站首页,写的大部分PHP脚本都要用到和MYSQL数据库相关的 ...
- PHP IDE phpstorm 常用快捷键
PHP IDE phpstorm 常用快捷键 投稿:junjie 字体:[增加 减小] 类型:转载 这篇文章主要介绍了PHP IDE phpstorm 常用快捷键,本文分别列出了mac系统和Win ...
- 学习VS生活
很多时候,失败的原因归结为一点:我没有时间...代码敲不完,我真的是没有时间么?很多时候是没意识的浪费时间 我每次进教室,总能看到吴刚和赵东亮在敲代码,为啥他们有时间呢?很多时候,时间就像那啥,挤一挤 ...
- 2014总结&2015计划
2014总结&2015计划 今天是2015/1/1,新的一年终于到来了,昨天老板要求提交2014的工作总结和2015的工作计划,正好提醒我,要总结和计划了. 先回顾2014年初的计划: 新年计 ...