码迷,mamicode.com
首页 > 其他好文 > 详细

百度编辑器(UEditor)自定义工具栏

时间:2017-03-04 12:54:52      阅读:7591      评论:0      收藏:0      [点我收藏+]

标签:com   大写   order   subscript   颜色   enable   lock   截图   class   

百度编辑器(UEditor)自定义工具栏的自定义

百度编辑器默认功能比较齐全,但是不一定是我们所需要的,有的功能可以去掉,用自己想要的就可以了,可以参考百度官方文档!

百度编辑器默认配置展示界面

技术分享

如何自定义工具栏:

方法一:在实例化编辑器的时候红色文字部分便是你所需要的

 1 <script type="text/Javascript">  
 2     var editor = UE.getEditor(‘container‘,{  
 3         //这里可以选择自己需要的工具按钮名称,此处仅选择如下五个  
 4         toolbars:[[‘FullScreen‘, ‘Source‘, ‘Undo‘, ‘Redo‘,‘bold‘,‘test‘]],  
 5         //focus时自动清空初始化时的内容  
 6         autoClearinitialContent:true,  
 7         //关闭字数统计  
 8         wordCount:false,  
 9         //关闭elementPath  
10         elementPathEnabled:false,  
11         //默认的编辑区域高度  
12         initialFrameHeight:300  
13         //更多其他参数,请参考ueditor.config.js中的配置项  
14     });  
15 </script>

方法二:

直接修改ueditor.config.js配置文件

 找到:红色框中的内容并注释掉重新选中自己需要的

第一步:

技术分享

第二步:修改成你所需要的比如

 

 1 , toolbars: [[
 2         ‘link‘, //超链接
 3         ‘unlink‘, //取消链接
 4         ‘|‘,
 5         ‘forecolor‘, //字体颜色
 6         ‘backcolor‘, //背景色
 7         ‘fontfamily‘, //字体
 8         ‘fontsize‘, //字号        
 9         ‘|‘,        
10         ‘bold‘, //加粗
11         ‘italic‘, //斜体
12         ‘underline‘, //下划线
13         ‘strikethrough‘, //删除线
14         ‘|‘,
15         ‘formatmatch‘, //格式刷
16         ‘removeformat‘, //清除格式
17         ‘|‘,
18         ‘insertorderedlist‘, //有序列表
19         ‘insertunorderedlist‘, //无序列表
20         ‘|‘,
21         ‘inserttable‘, //插入表格
22         ‘paragraph‘, //段落格式
23         ‘simpleupload‘, //单图上传
24         ‘imagecenter‘, //居中
25         ‘attachment‘, //附件
26         
27         ‘|‘,
28         ‘justifyleft‘, //居左对齐
29         ‘justifycenter‘, //居中对齐
30         ‘horizontal‘, //分隔线
31         ‘|‘,
32         ‘blockquote‘, //引用
33         ‘insertcode‘, //代码语言
34         
35         ‘|‘,
36         ‘source‘, //源代码
37         ‘preview‘, //预览
38         ‘fullscreen‘, //全屏
39         ]]

展现效果:

技术分享

完整的按钮列表参考:

 1 toolbars: [
 2     [
 3         ‘anchor‘, //锚点
 4         ‘undo‘, //撤销
 5         ‘redo‘, //重做
 6         ‘bold‘, //加粗
 7         ‘indent‘, //首行缩进
 8         ‘snapscreen‘, //截图
 9         ‘italic‘, //斜体
10         ‘underline‘, //下划线
11         ‘strikethrough‘, //删除线
12         ‘subscript‘, //下标
13         ‘fontborder‘, //字符边框
14         ‘superscript‘, //上标
15         ‘formatmatch‘, //格式刷
16         ‘source‘, //源代码
17         ‘blockquote‘, //引用
18         ‘pasteplain‘, //纯文本粘贴模式
19         ‘selectall‘, //全选
20         ‘print‘, //打印
21         ‘preview‘, //预览
22         ‘horizontal‘, //分隔线
23         ‘removeformat‘, //清除格式
24         ‘time‘, //时间
25         ‘date‘, //日期
26         ‘unlink‘, //取消链接
27         ‘insertrow‘, //前插入行
28         ‘insertcol‘, //前插入列
29         ‘mergeright‘, //右合并单元格
30         ‘mergedown‘, //下合并单元格
31         ‘deleterow‘, //删除行
32         ‘deletecol‘, //删除列
33         ‘splittorows‘, //拆分成行
34         ‘splittocols‘, //拆分成列
35         ‘splittocells‘, //完全拆分单元格
36         ‘deletecaption‘, //删除表格标题
37         ‘inserttitle‘, //插入标题
38         ‘mergecells‘, //合并多个单元格
39         ‘deletetable‘, //删除表格
40         ‘cleardoc‘, //清空文档
41         ‘insertparagraphbeforetable‘, //"表格前插入行"
42         ‘insertcode‘, //代码语言
43         ‘fontfamily‘, //字体
44         ‘fontsize‘, //字号
45         ‘paragraph‘, //段落格式
46         ‘simpleupload‘, //单图上传
47         ‘insertimage‘, //多图上传
48         ‘edittable‘, //表格属性
49         ‘edittd‘, //单元格属性
50         ‘link‘, //超链接
51         ‘emotion‘, //表情
52         ‘spechars‘, //特殊字符
53         ‘searchreplace‘, //查询替换
54         ‘map‘, //Baidu地图
55         ‘gmap‘, //Google地图
56         ‘insertvideo‘, //视频
57         ‘help‘, //帮助
58         ‘justifyleft‘, //居左对齐
59         ‘justifyright‘, //居右对齐
60         ‘justifycenter‘, //居中对齐
61         ‘justifyjustify‘, //两端对齐
62         ‘forecolor‘, //字体颜色
63         ‘backcolor‘, //背景色
64         ‘insertorderedlist‘, //有序列表
65         ‘insertunorderedlist‘, //无序列表
66         ‘fullscreen‘, //全屏
67         ‘directionalityltr‘, //从左向右输入
68         ‘directionalityrtl‘, //从右向左输入
69         ‘rowspacingtop‘, //段前距
70         ‘rowspacingbottom‘, //段后距
71         ‘pagebreak‘, //分页
72         ‘insertframe‘, //插入Iframe
73         ‘imagenone‘, //默认
74         ‘imageleft‘, //左浮动
75         ‘imageright‘, //右浮动
76         ‘attachment‘, //附件
77         ‘imagecenter‘, //居中
78         ‘wordimage‘, //图片转存
79         ‘lineheight‘, //行间距
80         ‘edittip ‘, //编辑提示
81         ‘customstyle‘, //自定义标题
82         ‘autotypeset‘, //自动排版
83         ‘webapp‘, //百度应用
84         ‘touppercase‘, //字母大写
85         ‘tolowercase‘, //字母小写
86         ‘background‘, //背景
87         ‘template‘, //模板
88         ‘scrawl‘, //涂鸦
89         ‘music‘, //音乐
90         ‘inserttable‘, //插入表格
91         ‘drafts‘, // 从草稿箱加载
92         ‘charts‘, // 图表
93     ]

 

百度编辑器(UEditor)自定义工具栏

标签:com   大写   order   subscript   颜色   enable   lock   截图   class   

原文地址:http://www.cnblogs.com/JiYF/p/6500946.html

(1)
(1)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!