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. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...
随机推荐
- ASP.NET WEB API的服务托管(Self-HOST)
如果我们想对外发布RESTful API,可以基于ASP.NET来构建Restful APIs,但需要部署IIS吗?答案是不必.你可以把它托管到一个Windows Service.具体如何把WEB A ...
- 8. Add the dashboard
Controller Node: 1. sudo apt-get install apache2 memcached libapache2-mod-wsgi openstack-dashboard ...
- iOS dispatch_source_t的理解
Dispatch Source是GCD中的一个基本类型,从字面意思可称为调度源,它的作用是当有一些特定的较底层的系统事件发生时,调度源会捕捉到这些事件,然后可以做其他的逻辑处理,调度源有多种类型,分别 ...
- 前端编码规范(4)—— CSS 和 Sass (SCSS) 规范
CSS and Sass (SCSS) style rules ID and class naming ID和class(类)名总是使用可以反应元素目的和用途的名称,或其他通用名称.代替表象和晦涩难懂 ...
- 前端CSS参考阅读
CSS 2.2 W3标准 http://dev.w3.org/csswg/css2/ CSS2 中文翻译 http://files.cnblogs.com/files/mize/CSS2_Chines ...
- 20145317彭垚《Java程序设计》第3周学习总结
20145317彭垚<Java程序设计>第3周学习总结 教材学习内容总结 第四章 4.1类与对象 4.1.1定义类: new clothes():新建一个对象. class clothes ...
- Cacti安装详细步骤
原文链接: https://www.centos.bz/2012/01/cacti-install-tutorials/ Cacti-监控MySQL: http://www.cszhi.com/201 ...
- 9.PHP内核探索:通过mod_php5支持PHP
Apache对PHP的支持是通过Apache的模块mod_php5来支持的.如果希望Apache支持PHP的话,在./configure步 骤需要指定--with-apxs2=/usr/local/a ...
- wdate-year-month-week-gategory-amount-coin
---2016-12-02 19:46:39 the whole table DISTINCT field SUM(field) COUNT(field) --- 888983 rows OK SEL ...
- OpenMP初步(英文)
Beginning OpenMP OpenMP provides a straight-forward interface to write software that can use multipl ...