在使用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 定制工具栏图标的更多相关文章

  1. 富文本编辑器UEditor自定义工具栏(三、自定义工具栏功能按钮图标及工具栏样式简单修改)

    导读 富文本编辑器UEditor提供丰富了定制配置项,如果想设置个性化的工具栏按钮图标有无办法呢?答案是肯定的!前两篇博文简要介绍了通过将原工具栏隐藏,在自定义的外部按钮上,调用UEditor各命令实 ...

  2. 富文本编辑器UEditor自定义工具栏(一、基础配置与字体、背景色、行间距、超链接实现)

    导读:UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,功能强大,可定制,是一款优秀的国产在线富文本编辑器,编辑器内可插入图片.音频.视频等. 一.UEditor自定义 ...

  3. eclipse定制工具栏,修改工具栏

    目前eclipse定制工具栏的入口就是window- customize perspective,在弹出的窗口中选择Tool Bar Visibility,选择要在工具栏中显示的快捷图标.注:在Too ...

  4. ueditor的工具栏显示乱码解决方法 小问题.. 是你的页面编码与语言包js编码不符所导致的

    ueditor的工具栏显示乱码解决方法 小问题..  是你的页面编码与语言包js编码不符所导致的解决方法:用记事本将ueditor\..\lang\zh-cn\zh-cn.js打开,然后保存为ANSI ...

  5. 富文本编辑器UEditor自定义工具栏(二、插入图片、音频、视频个性化功能按钮和弹层及自定义分页符)

    导读:本篇将简单探讨插入图片.音频.视频的功能按钮实现方式 传送门:富文本编辑器UEditor自定义工具栏(一.基础配置与字体.背景色.行间距.超链接实现) 一.效果图 1.UEditor自定义工具栏 ...

  6. kendo UI 倒如css 和 js 后 窗口控件上的工具栏图标不显示如何解决

    examples 文档中找到window的例子打开一个 查看其中文件引入 <head>    <title>API</title>    <meta char ...

  7. (转)在高分辨率下eclipse,STS,等软件工具栏图标过小的问题方法总结

    背景:在高分辨率情况下,sts工具栏图标超小,肉眼看不清.按照方法二能够满足需求,开心 https://blog.csdn.net/u012687923/article/details/8032437 ...

  8. 第三波假期干货——webstrom工具栏图标

    在WS中使用工具栏上的快捷图标来配合工作可以有效提高效率,因为你不用去记住一些快捷键,只要点一下鼠标即可.不过在WS中有很多实用功能却是没有自带个性图标的,导致自定义工具栏后可能就是好几个一模一样的绿 ...

  9. 关于swift 底部工具栏图标锯齿模糊问题。

    今天在底部工具栏添加图片时发现图片模糊而且有锯齿,开始一直以为是美工给的图片有问题,后来发现是要设置两种图片: 比如  index.png(默认30 * 30),indexSelected(选中后的图 ...

随机推荐

  1. LeetCode初级算法的Python实现--动态规划

    动态规划的本质是递归:所以做题之前一定要会递归:递归式就是状态转移方程:这里将会介绍使用动态规划做题的思维方式. 统一的做题步骤: 1.用递归的方式写出代码:(此方法写的代码在leetcode中一定会 ...

  2. rsync同步常用命令

    转载源地址http://blog.csdn.net/niushuai666/article/details/16880061 如果你是一位运维工程师,你很可能会面对几十台.几百台甚至上千台服务器,除了 ...

  3. 北京Uber优步司机奖励政策(12月11日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  4. LeetCode: 31. Next Permutation (Medium)

    1. 原题链接 https://leetcode.com/problems/next-permutation/description/ 2. 题目要求 给出一个整型数组,让我们给出下一个排序情况.注意 ...

  5. logback.xml日志文件配置

    放在resources目录下面就可以自动读取<?xml version="1.0" encoding="UTF-8"?> <configura ...

  6. linux-flock文件锁之实际运用

    vi test.sh #! /bin/bash echo "Hello World" touch test.lock #随便命名 [root@localhost ~]# flock ...

  7. Ruby 基础教程1-3

    1.命令行参数ARGV[] 2.文件读取 file=File.open(filename)    text=file.read  print text file.close 一次读取所有内容耗内存,耗 ...

  8. java 泛型历史遗留问题

    Map<String,Integer> hashMap = new HashMap<String,Integer>(); hashMap.put(); // hashMap.p ...

  9. Python字符串操作大全(非常全!!!)

    1. python编程里字符串的内置方法(非常全) capitalize() 把字符串的第一个字符改为大写 casefold() 把整个字符串的所有字符改为小写 center(width) 将字符串居 ...

  10. Nginx与Ribbon的区别

    服务器端负载均衡 Nginx Nginx 基于C语言,快速,性能高5w/s. Redis 5w/s,RibbatMQ 1.2w/s ApacheActiveMQ 0.6w/s 业务系统,kafka 2 ...