接下来, 再对config进行一些修改.
1. 先是工具栏的配置, 以下是默认配置
//工具栏上的所有的功能按钮和下拉框,可以在new编辑器的实例时选择自己需要的从新定义 toolbars:[ ['FullScreen', 'Source', '¦', 'Undo', 'Redo', '¦', 'Bold', 'Italic', 'Underline', 'StrikeThrough', 'Superscript', 'Subscript', 'RemoveFormat', 'FormatMatch', '¦', 'BlockQuote', '¦', 'PastePlain', '¦', 'ForeColor', 'BackColor', 'InsertOrderedList', 'InsertUnorderedList', '¦', 'CustomStyle', 'Paragraph', 'RowSpacing', 'LineHeight', 'FontFamily', 'FontSize', '¦', 'DirectionalityLtr', 'DirectionalityRtl', '¦', '', 'Indent', '¦', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyJustify', '¦', 'Link', 'Unlink', 'Anchor', '¦', 'ImageNone', 'ImageLeft', 'ImageRight', 'ImageCenter', '¦', 'InsertImage', 'Emotion', 'InsertVideo', 'Map', 'GMap', 'InsertFrame', 'PageBreak', 'HighlightCode', '¦', 'Horizontal', 'Date', 'Time', 'Spechars', '¦', 'InsertTable', 'DeleteTable', 'InsertParagraphBeforeTable', 'InsertRow', 'DeleteRow', 'InsertCol', 'DeleteCol', 'MergeCells', 'MergeRight', 'MergeDown', 'SplittoCells', 'SplittoRows', 'SplittoCols', '¦', 'SelectAll', 'ClearDoc', 'SearchReplace', 'Print', 'Preview', 'CheckImage', 'Help'] ],
官方的说法是可以在new实例的时候传入配置, 但是我个人觉得这样在调用的时候还挺繁琐的. 倒是不如直接复制一个config文件, 在里面进行修改. 修改后直接在html代码里面嵌入这个config就成了~
总之, 大家可以采用自己喜欢的方式啦.
我的时光邮局采用的配置是:
toolbars:[ ['Source', 'Undo', 'Redo', '¦', 'Bold', 'Italic', 'Underline', 'StrikeThrough', 'Superscript', 'Subscript', 'RemoveFormat', 'FormatMatch', 'PastePlain', '¦', 'ForeColor', 'BackColor', 'InsertOrderedList', 'InsertUnorderedList', '¦', 'FontFamily', 'FontSize', '¦', '', '¦', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyJustify'], ['Link', 'Unlink', 'Anchor', '¦', 'InsertImage', 'CheckImage', 'Emotion', 'InsertVideo', 'Map', 'HighlightCode', '¦', 'Horizontal', 'Date', 'Time', 'Spechars', '¦', 'InsertTable', 'DeleteTable', 'InsertParagraphBeforeTable', 'InsertRow', 'DeleteRow', 'InsertCol', 'DeleteCol', 'MergeCells', 'SplittoCells', 'SplittoRows', 'SplittoCols', 'SearchReplace', 'Print', 'Preview'] ],
2. 接下来有一个很神奇的配置, zindex,
zIndex : 999, //编辑器z-index的基数
这个是什么呢, 根据它的名称, 就是一个div的z轴index, 再通俗点儿说, 这个值越大, 它越会被显示在上层. 刚开始的时候, 我的日期时间控件, 弹出的日期输入框, 发现竟然在ueditor的下面…于是我就把这个值修改小了(100), 于是就不会遮住日期输入框啦. 当然, 修改datetimepicker的zIndex也是一样的~
3. 关闭远程图片抓取. 之前在1.1.8的版本中没有这个功能, 新版本增加了这个, 不过我个人感觉用处不大, 而且大大增加了改造的复杂度…所以干脆就关闭啦~
catchRemoteImageEnable:false, //是否开启远程图片抓取
4. 修改表情包
我倒是没有新增表情包, 但是觉得自带的表情, 有些很磋..比如有啊表情之类…干脆删掉好了~我只保留了两个, 兔斯基&绿豆蛙
这个也比较简单, 修改dialog下面的emotion.js和emotion.html, 基本上就是一些数组啊神马的~另外emotion.css以及image底下的无用配置, 无用图片都可以直接删除了~
除此之外, 在config中打开本地表情配置, 即
emotionLocalization:true, //是否开启表情本地化,默认关闭。若要开启请确保emotion文件夹下包含官网提供的images表情文件夹
emotion.js, emotion.html, emotion.css这三个文件我已经修改好, 可以直接下载zip包:
emotion
5. 以上的方法会使用相对路径作为表情的路径, 实际上, 我们还可以利用sae的storage, 产生绝对路径的地址
1) 建立一个storage, 设为公有, 不过期, (可以根据需要去除防盗链功能). 将0.gif文件和ldw, tsj这两个文件夹上传到emotion目录中去. 这样的话, 表情的地址就是类似于:
http://应用名称-Storage名称.stor.sinaapp.com/emotion/tsj/t_0001.gif
然后根据上面的zip包里面的内容, 做一些修改, 将emotion.js中emotion.SmileyPath修改为:
http://应用名称-Storage名称.stor.sinaapp.com/emotion/
即可~
这样的话, 图片的表情地址就是http://开头的绝对路径啦~
好, 基础的配置也就到此结束啦, 下一篇文章再继续说说, 针对图片上传, 需要做怎样的修改~~
emotion.SmileyPath
本文链接:https://www.poisonbian.com/post/149.html 转载需授权!