Question

Hi I am using NicEditor and I want the font size work in defferent way bec. rightnow the editor uses the:

<font amount= 1..7 >the selected text here</font>

I wan t it to become a span tag i.e.

<span Format= font-size:30px >the selected text here</span>

Here is the code for the dropdown:

var nicEditorFontSizeSelect = nicEditorSelect.extend({
    sel : {1 :  1&nbsp;(8pt) , 2 :  2&nbsp;(10pt) , 3 :  3&nbsp;(12pt) , 4 :  4&nbsp;(14pt) , 5 :  5&nbsp;(18pt) , 6 :  6&nbsp;(24pt) , 7 :  7&nbsp;(36pt) , 8 :  8&nbsp;(48pt) , 9 :  9&nbsp;(72pt) , 10 :  10&nbsp;90pt) , 11 :  11&nbsp;(100pt) },
    init : function() {
        this.setDisplay( Font&nbsp;Size... );
        for(itm in this.sel) {
            this.add(itm, <font size=" +itm+ "> +this.sel[itm]+ </font> );
        }       
    }
});

but I can not find the code to modify so that it will replace the font into a span tag inside the textarea.

任何建议都受到欢迎。

Thank you

Answer 1

众所周知,这是一个老问题,但任何人都需要回答。

值得注意的是,这非常基本,而且可能与改进有关,例如,它造成了nes。

Anyway, add this JS code before you initialise your nicEditor, create a custom plugin:

var nicSelectOptionsCustomFormat = {
    buttons : {
         fontCustomSize  : {name : __( Font size ), type :  nicEditorCustomFormatSelect }
    }
};
var nicEditorCustomFormatSelect = nicEditorSelect.extend({
    sel : { 11px  :  11px ,  13px  :  13px ,  15px  :  15px ,  19px  :  19px ,  22px  :  22px },

    init : function() {
        this.setDisplay( Font size );
        for(itm in this.sel) {
            this.add(itm, <span style="size: +itm+ "> +this.sel[itm]+ </span> );
        }
    }

    ,update : function(elm) {
        var newNode = document.createElement( span );
        newNode.style.fontSize = elm;
        var rng = this.ne.selectedInstance.getRng().surroundContents(newNode);
        this.close();
    }
});
nicEditors.registerPlugin(nicPlugin,nicSelectOptionsCustomFormat);

然后使用<条码>。当你创建编辑时,例如:

var config = {
    buttonList: ["bold", "italic", "underline","fontCustomSize"]
};
var e = new nicEditor(config);
e.panelInstance("page-description");

友情链接