ueditor 定制工具栏图标
在使用Ueditor时,如要简化工具栏上的按钮,可以修改配置项的方法: 1. 方法一:修改 ueditor.config.js 里面的 toolbars 2. 方法二:实例化编辑器的时候传入 toolbars 参数
我一般用第二种方法,
<script src="~/Content/ueditor/ueditor.config.js"></script>
<script src="~/Content/ueditor/ueditor.all.min.js"></script>
<script type="text/plain" id="bcontent" name="bcontent" style="width:100%;height:360px;">
</script>
<script type="text/javascript"> var ue = UE.getEditor('bcontent', {
toolbars: [["fullscreen","source","undo","redo","bold","italic","underline","fontborder","strikethrough","superscript","subscript","insertunorderedlist","insertorderedlist","justifyleft","justifycenter","justifyright","justifyjustify","removeformat","simpleupload","snapscreen","emotion","attachment"]]
,
autoHeightEnabled: true,
autoFloatEnabled: true
});
</script>
这样可以在一个项目中使用多种风格的工具栏,我的偷懒方法是,先上官方网站下载中有一项定制:http://ueditor.baidu.com/website/download.html#ubuilder,通过定制用鼠标选择想要的按钮,完成后下载资源包,下载包中有ueditor.config.js文件打开,拷贝其中的toolbars 参数,在网页实例化编辑器时传入 toolbars 参数
var ue = UE.getEditor('bcontent', {
toolbars: [["fullscreen","source","undo","redo","bold","italic","underline","fontborder","strikethrough","superscript","subscript","insertunorderedlist","insertorderedlist","justifyleft","justifycenter","justifyright","justifyjustify","removeformat","simpleupload","snapscreen","emotion","attachment"]]
,
autoHeightEnabled: true,
autoFloatEnabled: true
});
ueditor 定制工具栏图标的更多相关文章
- 富文本编辑器UEditor自定义工具栏(三、自定义工具栏功能按钮图标及工具栏样式简单修改)
导读 富文本编辑器UEditor提供丰富了定制配置项,如果想设置个性化的工具栏按钮图标有无办法呢?答案是肯定的!前两篇博文简要介绍了通过将原工具栏隐藏,在自定义的外部按钮上,调用UEditor各命令实 ...
- 富文本编辑器UEditor自定义工具栏(一、基础配置与字体、背景色、行间距、超链接实现)
导读:UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,功能强大,可定制,是一款优秀的国产在线富文本编辑器,编辑器内可插入图片.音频.视频等. 一.UEditor自定义 ...
- eclipse定制工具栏,修改工具栏
目前eclipse定制工具栏的入口就是window- customize perspective,在弹出的窗口中选择Tool Bar Visibility,选择要在工具栏中显示的快捷图标.注:在Too ...
- ueditor的工具栏显示乱码解决方法 小问题.. 是你的页面编码与语言包js编码不符所导致的
ueditor的工具栏显示乱码解决方法 小问题.. 是你的页面编码与语言包js编码不符所导致的解决方法:用记事本将ueditor\..\lang\zh-cn\zh-cn.js打开,然后保存为ANSI ...
- 富文本编辑器UEditor自定义工具栏(二、插入图片、音频、视频个性化功能按钮和弹层及自定义分页符)
导读:本篇将简单探讨插入图片.音频.视频的功能按钮实现方式 传送门:富文本编辑器UEditor自定义工具栏(一.基础配置与字体.背景色.行间距.超链接实现) 一.效果图 1.UEditor自定义工具栏 ...
- kendo UI 倒如css 和 js 后 窗口控件上的工具栏图标不显示如何解决
examples 文档中找到window的例子打开一个 查看其中文件引入 <head> <title>API</title> <meta char ...
- (转)在高分辨率下eclipse,STS,等软件工具栏图标过小的问题方法总结
背景:在高分辨率情况下,sts工具栏图标超小,肉眼看不清.按照方法二能够满足需求,开心 https://blog.csdn.net/u012687923/article/details/8032437 ...
- 第三波假期干货——webstrom工具栏图标
在WS中使用工具栏上的快捷图标来配合工作可以有效提高效率,因为你不用去记住一些快捷键,只要点一下鼠标即可.不过在WS中有很多实用功能却是没有自带个性图标的,导致自定义工具栏后可能就是好几个一模一样的绿 ...
- 关于swift 底部工具栏图标锯齿模糊问题。
今天在底部工具栏添加图片时发现图片模糊而且有锯齿,开始一直以为是美工给的图片有问题,后来发现是要设置两种图片: 比如 index.png(默认30 * 30),indexSelected(选中后的图 ...
随机推荐
- 在vue项目中添加eslint规则
自己配置脚手架时候如何安装eslint语法规则, 第一步安装 官方推荐的安装包如下 eslint eslint-config-standard eslint-plugin-standard eslin ...
- 【blockly教程】Blockly编程案例
案例一 原码反码和补码 我们把一个数在计算机内被表示的二进制形式称为机器数,该数称为这个机器数的真值.机器数有固定的位数,具体是多少位与机器有关,通常是8位或16位.原码:是指符号位用0或1表示,0 ...
- inner join(inner可省) 与 left join 之间的区别
关于inner join 与 left join 之间的区别,以前以为自己搞懂了,今天从前端取参数的时候发现不是预想中的结果,才知道问题出在inner join 上了. 需求是从数据库查数据,在前端以 ...
- 北京Uber优步司机奖励政策(3月4日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- Netty概述
一,介绍 Netty是由JBOSS提供的一个java开源框架.Netty提供异步的.事件驱动的网络应用程序框架和工具,用以快速开发高性能.高可靠性的网络服务器和客户端程序. 也就是说,Netty 是一 ...
- 【POJ2182】Lost Cows
[POJ2182]Lost Cows 题面 vjudge 题解 从后往前做 每扫到一个点\(i\)以及比前面小的有\(a[i]\)个数 就是查询当前的第\(a[i]+1\)小 然后查询完将这个数删掉 ...
- steam更新出错 应用运行中
游戏程序没有完全关闭,仍在后台运行. 打开任务处理器,选择进程,下面找到TslGame,关闭之.
- ThinkPHP开启设置子域名笔记
一.ThinkPHP框架里 common下的config文件 'APP_SUB_DOMAIN_DEPLOY' => 1, // 开启子域名配置 'APP_SUB_DOMAIN_RULES' =& ...
- linux 安装 node.js
wget http://nodejs.org/dist/v0.10.26/node-v0.10.26.tar.gztar zxvf node-v0.10.26.tar.gzcd node-v0.10. ...
- ElasticSearch搜索引擎安装配置中文分词器IK插件
近几篇ElasticSearch系列: 1.阿里云服务器Linux系统安装配置ElasticSearch搜索引擎 2.Linux系统中ElasticSearch搜索引擎安装配置Head插件 3.Ela ...