UEditor 的配置项分为两类:前端配置项 和 后端配置项

后端配置项具体看这个文档L:后端配置项说明

本文档介绍如何通过设置前端配置项,定制编辑器的特性,配置方法主要通过修改ueditor.config.js,另外在编辑器实例化的时候也可以传入配置参数

    var ue = UE.getEditor('container', {
toolbars: [
['fullscreen', 'source', 'undo', 'redo', 'bold']
],
autoHeightEnabled: true,
autoFloatEnabled: true
});

读取配置项

读取配置项可以通过getOpt方法读取


var lang = ue.getOpt('lang'); //默认返回:zh-c

前端配置项说明

以下的"URL"是ueditor.config.js文件所在目录

  • UEDITOR_HOME_URL {Path String} [默认值:根据config文件路径自动获取] // 为编辑器实例添加一个路径,这个不能被注释

  • serverUrl {Path String} [默认值:URL + "php/controller.php"] // 服务器统一请求接口路径

  • toolbars {2d Array} //工具栏上的所有的功能按钮和下拉框,可以在new编辑器的实例时选择自己需要的从新定义

  • labelMap {Object} [默认:从lang包的labelMap项获取] //参数格式是键值对,键名对应toolbar参数的项:{"bold": "加粗"} ],当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准

  • lang {String} [默认值:"zh-cn"] //lang值也可以通过自动获取 (navigator.language||navigator.browserLanguage ||navigator.userLanguage).toLowerCase(),语言配置项,默认是zh-cn。有需要的话也可以使用如下这样的方式来自动多语言切换,当然,前提条件是lang文件夹下存在对应的语言文件:

  • langPath {Path String} [默认值:URL +"lang/"] //语言包文件存放目录

  • theme {String} [默认值:'default'] //主题配置项,默认是default。有需要的话也可以使用如下这样的方式来自动多主题切换,当然,前提条件是themes文件夹下存在对应的主题文件:

  • themePath {Path String} [默认值:URL +"themes/"] //现有如下皮肤:default

  • zIndex {Number} [默认值:900] //编辑器在页面上的z-index层级的基数,默认是900

  • charset {String} [默认值:"utf-8"] //针对getAllHtml方法,会在对应的head标签中增加该编码设置。

  • customDomain {Boolean} [默认值:false] //若实例化编辑器的页面手动修改的domain,此处需要设置为true

  • isShow {Boolean} [默认值:true] //默认显示编辑器

  • textarea {String} [默认值:'editorValue'] // 提交表单时,服务器获取编辑器提交内容的所用的参数,多实例时可以给容器name属性,会将name给定的值最为每个实例的键值,不用每次实例化的时候都设置这个值

  • initialContent {String} [默认值:'欢迎使用ueditor!'] //初始化编辑器的内容,也可以通过textarea/script给值,看官网例子

  • autoClearinitialContent {Boolean} [默认值:true] //是否自动清除编辑器初始内容,注意:如果focus属性设置为true,这个也为真,那么编辑器一上来就会触发导致初始化的内容看不到了

  • focus {Boolean} [默认值:false] //初始化时,是否让编辑器获得焦点true或false

  • initialStyle {String} [默认值:'p{line-height:1em}']//编辑器层级的基数,可以用来改变字体等 //如果自定义,最好给p标签如下的行高,要不输入中文时,会有跳动感

  • iframeCssUrl {Path String} [默认值:URL + '/themes/iframe.css'] //给编辑器内部引入一个css文件

  • indentValue {String} [默认值:'2em'] //首行缩进距离,默认是2em

  • initialFrameWidth {Number} [默认值:1000] //初始化编辑器宽度,默认1000

  • initialFrameHeight {Number} [默认值:320] //初始化编辑器高度,默认320

  • readonly {Boolean} [默认值:false] //编辑器初始化结束后,编辑区域是否是只读的,默认是false

  • autoClearEmptyNode {Boolean} [默认值:true] //getContent时,是否删除空的inlineElement节点(包括嵌套的情况)

  • enableAutoSave {Boolean} [默认值:true] //启用自动保存

  • saveInterval {Number} [默认值:500] //自动保存间隔时间,单位ms

  • imageScaleEnabled {Boolean} [默认值:true] //启用图片拉伸缩放

  • fullscreen {Boolean} [默认值:false] //是否开启初始化时即全屏,默认关闭

  • imagePopup {Boolean} [默认值:true] //图片操作的浮层开关,默认打开

  • autoSyncData {Boolean} [默认值:true] //自动同步编辑器要提交的数据

  • emotionLocalization {Boolean} [默认值:false] //是否开启表情本地化,默认关闭。若要开启请确保emotion文件夹下包含官网提供的images表情文件夹

  • retainOnlyLabelPasted {Boolean} [默认值:false] //粘贴只保留标签,去除标签所有属性

  • pasteplain {Boolean} [默认值:false] //是否默认为纯文本粘贴。false为不使用纯文本粘贴,true为使用纯文本粘贴

  • filterTxtRules {Object} //纯文本粘贴模式下的过滤规则

    //默认值:
    function() {
    function transP(node) {
    node.tagName = 'p';
    node.setStyle();
    }
    return {
    //直接删除及其字节点内容
    '-': 'script style object iframe embed input select',
    'p': {
    $: {}
    },
    'br': {
    $: {}
    },
    'div': {
    '$': {}
    },
    'li': {
    '$': {}
    },
    'caption': transP,
    'th': transP,
    'tr': transP,
    'h1': transP,
    'h2': transP,
    'h3': transP,
    'h4': transP,
    'h5': transP,
    'h6': transP,
    'td': function(node) {
    //没有内容的td直接删掉
    var txt = !! node.innerText();
    if (txt) {
    node.parentNode.insertAfter(UE.uNode.createText(' '), node);
    }
    node.parentNode.removeChild(node, node.innerText())
    }
    }
    }()

    ()

  • allHtmlEnabled [默认值:false] //提交到后台的数据是否包含整个html字符串

  • insertorderedlist //有序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准

    
    
    //默认值:
    {
    //自定的样式
    'num': '1,2,3...',
    'num1': '1),2),3)...',
    'num2': '(1),(2),(3)...',
    'cn': '一,二,三....',
    'cn1': '一),二),三)....',
    'cn2': '(一),(二),(三)....',
    //系统自带
    'decimal': '' , '1,2,3...'
    'lower-alpha': '' , // 'a,b,c...'
    'lower-roman': '' , //'i,ii,iii...'
    'upper-alpha': '' , //'A,B,C'
    'upper-roman': '' //'I,II,III...'
    
    
    }
  • insertunorderedlist //无序列表的下拉配置,值留空时支持多语言自动识别,若配置值,则以此值为准

    { //自定的样式
    'dash': '— 破折号', //-破折号
    'dot': ' 。 小圆圈', //系统自带
    'circle': '', // '○ 小圆圈'
    'disc': '', // '● 小圆点'
    'square': '' //'■ 小方块'
    }]

    `

  • listDefaultPaddingLeft [默认值:'30'//默认的左边缩进的基数倍

  • listiconpath [默认值:'http://bs.baidu.com/listicon/']//自定义标号的路径
  • maxListLevel [默认值:3] //限制可以tab的级数, 设置-1为不限制

  • autoTransWordToList [默认值:false] //禁止word中粘贴进来的列表自动变成列表标签

  • fontfamily //字体设置 label留空支持多语言自动切换,若配置,则以配置值为准

    //默认值:
    [{
    label: '',
    name: 'songti',
    val: '宋体,SimSun'
    }, {
    label: '',
    name: 'kaiti',
    val: '楷体,楷体_GB2312, SimKai'
    }, {
    label: '',
    name: 'yahei',
    val: '微软雅黑,Microsoft YaHei'
    }, {
    label: '',
    name: 'heiti',
    val: '黑体, SimHei'
    }, {
    label: '',
    name: 'lishu',
    val: '隶书, SimLi'
    }, {
    label: '',
    name: 'andaleMono',
    val: 'andale mono'
    }, {
    label: '',
    name: 'arial',
    val: 'arial, helvetica,sans-serif'
    }, {
    label: '',
    name: 'arialBlack',
    val: 'arial black,avant garde'
    }, {
    label: '',
    name: 'comicSansMs',
    val: 'comic sans ms'
    }, {
    label: '',
    name: 'impact',
    val: 'impact,chicago'
    }, {
    label: '',
    name: 'timesNewRoman',
    val: 'times new roman'
    }]
  • fontsize {Array} //字号

    1. //默认值:
    2. [10, 11, 12, 14, 16, 18, 20, 24, 36]
  • paragraph {Object} //段落格式 值留空时支持多语言自动识别,若配置,则以配置值为准

    //默认值:
    {
    'p': '',
    'h1': '',
    'h2': '',
    'h3': '',
    'h4': '',
    'h5': '',
    'h6': ''
    }
  • rowspacingtop {Array} //段间距 值和显示的名字相同

    1. //默认值:
    2. ['5', '10', '15', '20', '25']
  • rowspacingbottom //段间距 值和显示的名字相同

    1. //默认值:
    2. ['5', '10', '15', '20', '25']
  • lineheight [默认值:['1', '1.5','1.75','2', '3', '4', '5'] ] //行内间距 值和显示的名字相同

  • customstyle [Array] //自定义样式,不支持国际化,此处配置值即可最后显示值block的元素是依据设置段落的逻辑设置的,inline的元素依据BIU的逻辑设置,尽量使用一些常用的标签

    //默认值:
    [{
    tag: 'h1', //tag 使用的标签名字
    name: 'tc', //
    label: '', //label 显示的名字也是用来标识不同类型的标识符,注意这个值每个要不同
    style: 'border-bottom:#ccc 2px solid;padding:0 4px 0 0;text-align:center;margin:0 0 20px 0;' //style 添加的样式
    }, //每一个对象就是一个自定义的样式
    {
    tag: 'h1',
    name: 'tl',
    label: '',
    style: 'border-bottom:#ccc 2px solid;padding:0 4px 0 0;margin:0 0 10px 0;'
    }, {
    tag: 'span',
    name: 'im',
    label: '',
    style: 'font-style:italic;font-weight:bold'
    }, {
    tag: 'span',
    name: 'hi',
    label: '',
    style: 'font-style:italic;font-weight:bold;color:rgb(51, 153, 204)'
    }
    ]
  • enableContextMenu {Boolean} [默认值:true] //打开右键菜单功能

  • contextMenu {Object} //右键菜单的内容,可以参考plugins/contextmenu.js里边的默认菜单的例子,label留空支持国际化,否则以此配置为准

    1. //默认值:
    2. [{
    3. label: '', //显示的名称
    4. cmdName: 'selectall', //执行的command命令,当点击这个右键菜单时
    5. exec: function() { //exec可选,有了exec就会在点击时执行这个function,优先级高于cmdName
    6. //this是当前编辑器的实例
    7. //this.ui._dialogs['inserttableDialog'].open();
    8. }
    9. }]
  • shortcutMenu {Array} //快捷菜单

    1. //默认值
    2. ["fontfamily", "fontsize", "bold", "italic", "underline", "forecolor", "backcolor", "insertorderedlist", "insertunorderedlist"]
  • elementPathEnabled {Boolean} [默认值:true] //是否启用元素路径,默认是显示

  • wordCount {Boolean} [默认值:true] //是否开启字数统计

  • maximumWords {Number} [默认值:10000] //允许的最大字符数
  • wordCountMsg {String} [默认值:] //当前已输入 {#count} 个字符,您还可以输入{#leave} 个字符,字数统计提示,{#count}代表当前字数,{#leave}代表还可以输入多少字符数,留空支持多语言自动切换,否则按此配置显示
    1. \\默认值:
    2. '当前已输入{#count}个字符, 您还可以输入{#leave}个字符。 '
  • wordOverFlowMsg {String} [默认值:] //超出字数限制提示 留空支持多语言自动切换,否则按此配置显示

    1. \\默认值:
    2. '<span style="color:red;">你输入的字符个数已经超出最大允许值,服务器可能会拒绝保存!</span>'
  • tabSize {Number} [默认值:4] //点击tab键时移动的距离,tabSize倍数,tabNode什么字符做为单位

  • tabNode {String} [默认值:' ']

  • removeFormatTags //清除格式时可以删除的标签和属性

    1. //默认值:
    2. 'b,big,code,del,dfn,em,font,i,ins,kbd,q,samp,small,span,strike,strong,sub,sup,tt,u,var'
  • removeFormatAttributes [默认值:'class,style,lang,width,height,align,hspace,valign'

  • maxUndoCount {Number} [默认值:20] //undo操作,可以最多回退的次数,默认20

  • maxInputCount {Number} [默认值:1] //undo操作,当输入的字符数超过该值时,保存一次现场

  • autoHeightEnabled {Boolean} [默认值:true] //是否自动长高,默认true

  • scaleEnabled {Boolean} [默认值:false] //是否可以拉伸长高,默认true(当开启时,自动长高失效)

  • minFrameWidth {Number} [默认值:800] //编辑器拖动时最小宽度,默认800
  • minFrameHeight {Number} [默认值:220] //编辑器拖动时最小高度,默认220

  • autoFloatEnabled [默认值:true] //是否保持toolbar的位置不动,默认true

  • topOffset [默认值:30] //浮动时工具栏距离浏览器顶部的高度,用于某些具有固定头部的页面

  • toolbarTopOffset [默认值:400] //编辑器底部距离工具栏高度(如果参数大于等于编辑器高度,则设置无效)

  • pageBreakTag [默认值:'ueditorpagebreaktag'] //分页标识符,默认是ueditorpagebreaktag

  • autotypeset {Object} //自动排版参数 默认值:

    1. {
    2. mergeEmptyline: true, //合并空行
    3. removeClass: true, //去掉冗余的class
    4. removeEmptyline: false, //去掉空行
    5. textAlign: "left", //段落的排版方式,可以是 left,right,center,justify 去掉这个属性表示不执行排版
    6. imageBlockLine: 'center', //图片的浮动方式,独占一行剧中,左右浮动,默认: center,left,right,none 去掉这个属性表示不执行排版
    7. pasteFilter: false, //根据规则过滤没事粘贴进来的内容
    8. clearFontSize: false, //去掉所有的内嵌字号,使用编辑器默认的字号
    9. clearFontFamily: false, //去掉所有的内嵌字体,使用编辑器默认的字体
    10. removeEmptyNode: false, // 去掉空节点
    11. //可以去掉的标签
    12. removeTagNames: {标签名字: 1
    13. },
    14. indent: false, // 行首缩进
    15. indentValue: '2em', //行首缩进的大小
    16. bdc2sb: false,
    17. tobdc: false
    18. }
  • tableDragable {Boolean} [默认值:true] //表格是否可以拖拽

  • disabledTableInTable {Boolean} [默认值:true] //禁止表格嵌套

  • sourceEditor {String} [默认值:"codemirror"] //源码的查看方式,codemirror是代码高亮,textarea是文本框,默认是codemirror,注意默认codemirror只能在ie8+和非ie中使用

  • codeMirrorJsUrl {Path String} [默认值:URL + "third-party/codemirror/codemirror.js"] //如果sourceEditor是codemirror需要配置这项,codeMirror js加载的路径

  • codeMirrorCssUrl {Path String} [默认值:URL + "third-party/codemirror/codemirror.css"] //如果sourceEditor是codemirror需要配置这项,codeMirror css加载的路径

  • sourceEditorFirst {String} [默认值:false] //编辑器初始化完成后是否进入源码模式,默认为否。

  • iframeUrlMap {Object} //dialog内容的路径 ~会被替换成URL,垓属性一旦打开,将覆盖所有的dialog的默认路径

    1. //默认值:
    2. {
    3. 'anchor': '~/dialogs/anchor/anchor.html',
    4. }
  • webAppKey {String} //webAppKey 百度应用的APIkey,每个站长必须首先去百度官网注册一个key后方能正常使用app功能,注册介绍,http://app.baidu.com/static/cms/getapikey.html

  • allowDivTransToP {Boolean} 默认会将外部进入的html数据中的Div标签转换成P标签,外部进入的数据包括粘贴和调用setContent接口进入编辑器的数据。如果设置成false将不在做这个转换。

UEditor前端配置项说明的更多相关文章

  1. 【转载】UEditor前端配置项说明

    UEditor 的配置项分为两类:前端配置项 和 后端配置项 后端配置项具体看这个文档L:后端配置项说明 本文档介绍如何通过设置前端配置项,定制编辑器的特性,配置方法主要通过修改ueditor.con ...

  2. 集成百度编辑器 ueditor 后端配置项没有正常加载,上传插件不能正常使用!

    项目要用到编辑器,于是集成了ueditor,集成ok,但一直显示 ‘’后端配置项没有正常加载,上传插件不能正常使用!‘’ 各种查: 网上说的无非就是那么集中情况 1. 因为百度官方的问题,php/co ...

  3. ueditor后台配置项返回格式出错,上传功能将不能正常使用

    和https://ask.csdn.net/questions/382087问题一样. java+jsp1.config.json配置不对2.百度依赖的jar包没引入3.请求controller.js ...

  4. php ueditor 后台配置项返回格式出错,上传功能将不能正常使用!

    解决常见的有两种 1,可能是时区设置问题,有系统区分大小写. date_default_timezone_set("Asia/chongqing");改为 date_default ...

  5. ueditor 后端配置项没有正常加载,上传插件不能正常使用 UTF8 PHP

    修改config.json 文件,用DW软件打开,修改好后,保存 若用记事本打开的话修改后保存,无法加载

  6. UEditor文档

    UEditor文档http://fex.baidu.com/ueditor/Ueditor 前后端数据交互 http://blog.csdn.net/bobo_93/article/details/5 ...

  7. PHP集成百度Ueditor 1.4.3

    下载安装 1.首先到官网下载最新版的UE1.4.3UE官方下载地址:http://ueditor.baidu.com/website/download.html#ueditor 这里我下载的是1.4. ...

  8. 第一篇 UEditor入门部署和体验

    UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. UEditor富文本编辑器,轻量, ...

  9. UEditor使用有感(黄色)

    UEditor 介绍 UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 1 入门部署 ...

随机推荐

  1. 如何加入别人的Git项目——Git Fork指南

    如何加入别人的Git项目--Git Fork指南 首先,在网页打开别人Git上的项目,点击右上角的.下图因为Fork过了,所以灰了. 随即弹出如下窗口,当然选择确定. 于是,我们在在自己的项目列表可以 ...

  2. 实验五 Java网络编程

    实验五 Java网络编程 实验五 Java网络编程 实验五所涉及的密码学算法及编程思路 ## Java对称加密-DES算法 (1) 获取密钥生成器 KeyGenerator kg=KeyGenerat ...

  3. [2016北京集训测试赛5]小Q与内存-[线段树的神秘操作]

    Description Solution 哇真的异常服气..线段树都可以搞合并和拆分的啊orzorz.神的世界我不懂 Code #include<iostream> #include< ...

  4. 北京Uber优步司机奖励政策(4月16日)

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

  5. ELKStack入门篇(二)之Nginx、Tomcat、Java日志收集以及TCP收集日志使用

    1.收集Nginx的json格式日志 1.1.Nginx安装 [root@linux-node1 ~]# yum install nginx -y [root@linux-node1 ~]# vim ...

  6. 质造未来,首届腾讯WeTest技术交流开放日成功举办

    WeTest 导读 北京时间12月21日下午1点整,2018年度腾讯WeTest技术交流开放日在上海举办.盛大.巨人.电魂.bilibili.方趣等十余家来自不同优秀企业的测试技术负责人均来到现场,共 ...

  7. HTTP结构讲解——《HTTP权威指南》系列

    HTTP结构 第二部分的5章主要介绍了HTTP服务器,代理,缓存,网关和机器人应用程序,这些都是Web系统架构的构造模块. Web服务器 第五章 Web服务器会对HTTP请求进行处理并提供响应.术语& ...

  8. qt linux系统下出现Qt5: Unknown module(s) in QT: serialport问题解决

    需要单独安装这个模块, manjaro linux打开包管理器,搜索安装,就好了

  9. NO.07--我跟“ 币乎 ”的那些事

    文章开头给大家安利一款app吧,就是我标题提到的,‘币乎’,一个近似于虚拟货币的论坛吧,大家可以下载试试,发文章点赞赚钱,... 好了,开始说一说今天的正题吧: 这些事情说起来其实挺惭愧的,但也不是什 ...

  10. Bellman-ford 模板

    #include<bits/stdc++.h> const int inf=0x3f3f3f3f; ; struct edge{ int u,v;//两个点 int w; //权值 Edg ...