UEditor前端配置項說明

前端配置項說明

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-cn

前端配置項說明

以下的"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} //字號

    //默認值:
    [10, 11, 12, 14, 16, 18, 20, 24, 36]

  • paragraph {Object} //段落格式 值留空時支持多語言自動識別,若配置,則以配置值爲準

    //默認值:
    {
        'p': '',
        'h1': '',
        'h2': '',
        'h3': '',
        'h4': '',
        'h5': '',
        'h6': ''
    }

  • rowspacingtop {Array} //段間距 值和顯示的名字相同

    //默認值:
    ['5', '10', '15', '20', '25']

  • rowspacingbottom //段間距 值和顯示的名字相同

    //默認值:
    ['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留空支持國際化,否則以此配置爲準

    //默認值:
    [{
        label: '', //顯示的名稱
        cmdName: 'selectall', //執行的command命令,當點擊這個右鍵菜單時
        exec: function() { //exec可選,有了exec就會在點擊時執行這個function,優先級高於cmdName
            //this是當前編輯器的實例
            //this.ui._dialogs['inserttableDialog'].open();
        }
    }]

  • shortcutMenu {Array} //快捷菜單

    //默認值
    ["fontfamily", "fontsize", "bold", "italic", "underline", "forecolor", "backcolor", "insertorderedlist", "insertunorderedlist"]

  • elementPathEnabled {Boolean} [默認值:true] //是否啓用元素路徑,默認是顯示

  • wordCount {Boolean} [默認值:true] //是否開啓字數統計

  • maximumWords {Number} [默認值:10000] //允許的最大字符數
  • wordCountMsg {String} [默認值:] //當前已輸入 {#count} 個字符,您還可以輸入{#leave} 個字符,字數統計提示,{#count}代表當前字數,{#leave}代表還可以輸入多少字符數,留空支持多語言自動切換,否則按此配置顯示
    \\默認值:
    '當前已輸入{#count}個字符, 您還可以輸入{#leave}個字符。 '
  • wordOverFlowMsg {String} [默認值:] //超出字數限制提示 留空支持多語言自動切換,否則按此配置顯示

    \\默認值:
    '<span style="color:red;">你輸入的字符個數已經超出最大允許值,服務器可能會拒絕保存!</span>'

  • tabSize {Number} [默認值:4] //點擊tab鍵時移動的距離,tabSize倍數,tabNode什麼字符做爲單位

  • tabNode {String} [默認值:'&nbsp;']

  • removeFormatTags //清除格式時可以刪除的標籤和屬性

    //默認值:
    '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} //自動排版參數 默認值:

    {
        mergeEmptyline: true, //合併空行
        removeClass: true, //去掉冗餘的class
        removeEmptyline: false, //去掉空行
        textAlign: "left", //段落的排版方式,可以是 left,right,center,justify 去掉這個屬性表示不執行排版
        imageBlockLine: 'center', //圖片的浮動方式,獨佔一行劇中,左右浮動,默認: center,left,right,none 去掉這個屬性表示不執行排版
        pasteFilter: false, //根據規則過濾沒事粘貼進來的內容
        clearFontSize: false, //去掉所有的內嵌字號,使用編輯器默認的字號
        clearFontFamily: false, //去掉所有的內嵌字體,使用編輯器默認的字體
        removeEmptyNode: false, // 去掉空節點
        //可以去掉的標籤
        removeTagNames: {標籤名字: 1
        },
        indent: false, // 行首縮進
        indentValue: '2em', //行首縮進的大小
        bdc2sb: false,
        tobdc: false
    }

  • 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的默認路徑

    //默認值:
    {
        'anchor': '~/dialogs/anchor/anchor.html',
    }

  • webAppKey {String} //webAppKey 百度應用的APIkey,每個站長必須首先去百度官網註冊一個key後方能正常使用app功能,註冊介紹,http://app.baidu.com/static/cms/getapikey.html

  • allowDivTransToP {Boolean} 默認會將外部進入的html數據中的Div標籤轉換成P標籤,外部進入的數據包括粘貼和調用setContent接口進入編輯器的數據。如果設置成false將不在做這個轉換。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章