百度编辑器调用135编辑器方法

一:首先在ueditor.config.js中toolbars项里增加一个135editor菜单项

 toolbars:[

['bold','italic', 'underline', 'fontborder', 'strikethrough',  '135editor','rowspacingtop', 'rowspacingbottom', 'lineheight','removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|','superscript', 'subscript' ]], 

二:在ueditor文件夹里创建135editor.js

UE.registerUI('135editor',function(editor,uiName){
  var dialog = new UE.ui.Dialog({
      iframeUrl: editor.options.UEDITOR_HOME_URL+'dialogs/135editor/135EditorDialogPage.html', // 135EditorDialogPage
      cssRules:"width:"+ parseInt(document.body.clientWidth*0.9) +"px;height:"+(window.innerHeight -50)+"px;",
      editor:editor,
      name:uiName,
      title:"135编辑器"
  });
  dialog.fullscreen = false;
  dialog.draggable = false;
  var btn = new UE.ui.Button({
      name:'btn-dialog-' + uiName,       
      className:'edui-for-135editor',
      title:'135编辑器',
      onclick:function () {
          dialog.render();
          dialog.open();
      }
  });
  return btn;
},undefined);
// 修改最后的undefined参数为数字序号,比如5,可调整135编辑器按钮的顺序。默认出现在最后面

三:根据路径,在响应的位置放置135页面的文件

百度编辑器调用135编辑器方法_第1张图片

 

四:在编辑器的页面添加css样式

.edui-button.edui-for-135editor .edui-button-wrap .edui-button-body .edui-icon{
  background-image: url("http://static.135editor.com/img/icons/editor-135-icon.png") !important;
  background-size: 85%;
  background-position: center;
  background-repeat: no-repeat;
}

完成,在编辑器即可看到135的菜单图标了

你可能感兴趣的:(web)