UEditor工具欄上自定義按鈕、圖標、事件和右擊菜單添加自定義按鈕

  首先我要說是，舉例說的這個版本是1.2以上的，因為一些配置代碼轉移到了zh-cn.js里，其他沒有變化。開門見山直接寫：（我自定義的是在線美圖功能）

第一步：找到ueditor.config.js文件中的toolbars參數，增加一個“xiuxiu”字符串

toolbars:[
 [...,'help','xiuxiu']
],

第二步：找到zh-cn.js文件中的labelMap參數，增加一個“xiuxiu：在線美圖”字符串，這是用於鼠標移到按鈕時出現的提示；

labelMap:{
 '...':'....' ,'xiuxiu':'在線美圖'
},

　此時在ueditor的工具欄已經有我們新加的按鈕了，如下所示。但此時這個按鈕沒有功能，點不動。有提示

　

第三步：找到themes/default/css/ueditor.css文件，增加一條樣式定義:

.edui-default .edui-toolbar .edui-for-xiuxiu .edui-icon {
    background-image: url(../images/xiuxiu.png); //你自己選好的圖標
    background-repeat: no-repeat;
    width: 70px !important;
    background-position: 0px 2px;
}

　

好了，就這樣添加了按鈕，換了圖標，下面開始寫事件

第四步：找到ueditor.all.js文件中的var btnCmds = [，在它里面添加‘xiuxiu’字符串；

第五步：找到ueditor.all.js文件中的UE.commands['cleardoc'] = {}函數，復制，在其下面粘貼，修改代碼

就這樣，這個功能就可以用了，

那么內容區右鍵菜單也添加按鈕怎么弄呢？這個就更好辦了

第一步：找到ueditor.all.js文件中的 UE.plugins['contextmenu'] = function () {}函數里添加一段代碼即可