首页 文章

CKEditor 4自定义下拉列表

提问于
浏览
1

我们正在尝试向CKeditor添加一个自定义下拉列表,它将包含我们将找到并替换的预设值列表,对于我的生活,我找不到一个简单的方法来执行此操作 . 看看TinyMCE非常简单:

http://www.tinymce.com/tryit/menubutton.php

对于CKEditor是否有这样的简单解决方案,我们宁愿不必为了这个功能而将CKeditor交换为TinyMCE . 我发现了一个名为PlaceHolder的插件,但这并不是我们想做的事情,说实话,我希望在没有插件的情况下做到这一点,只需按照TinyMCE的方式配置初始化 .

非常感谢任何见解 .

1 回答

  • 8

    这都是关于editor.ui.addRichComboJSFiddle):

    CKEDITOR.replace( 'editor', {
        toolbarGroups: [
            { name: 'mode' },
            { name: 'basicstyles' }
        ],    
        on: {
            pluginsLoaded: function() {
                var editor = this,
                    config = editor.config;
    
                editor.ui.addRichCombo( 'my-combo', {
                    label: 'My Dropdown Label',
                    title: 'My Dropdown Title',
                    toolbar: 'basicstyles,0',
    
                    panel: {               
                        css: [ CKEDITOR.skin.getPath( 'editor' ) ].concat( config.contentsCss ),
                        multiSelect: false,
                        attributes: { 'aria-label': 'My Dropdown Title' }
                    },
    
                    init: function() {    
                        this.startGroup( 'My Dropdown Group #1' );
                        this.add( 'foo', 'Foo!' );
                        this.add( 'bar', 'Bar!' );                    
    
                        this.startGroup( 'My Dropdown Group #2' );
                        this.add( 'ping', 'Ping!' );
                        this.add( 'pong', 'Pong!' );                    
    
                    },
    
                    onClick: function( value ) {
                        editor.focus();
                        editor.fire( 'saveSnapshot' );
    
                        editor.insertHtml( value );
    
                        editor.fire( 'saveSnapshot' );
                    }
                } );        
            }        
        }
    } );
    

相关问题