如何配置CKEditor-4内联编辑器?

Pet*_*uss 5 ckeditor

我有标准安装(如样品):

<meta charset="utf-8"></meta>
<script src="../ckeditor.js"></script>
Run Code Online (Sandbox Code Playgroud)

HTML内容包含许多<div contenteditable="true">块.我需要通过本地或外部configTypeX.js文件配置每个编辑器,

  <script>
   CKEDITOR.on( 'instanceCreated', function( event ) {
     var editor = event.editor, element = editor.element;
         if ( element.is( 'h1', 'h2', 'h3' ) ) {
        editor.on( 'configLoaded', function() {
            editor.config.toolbar = [
                [ 'Source', '-', 'Bold', 'Italic' ]
            ];  // BUG: about "Source"?? NOT AT INTERFACE!
        }); 
         } else {
            // WHERE PUT THIS ITEM?
    customConfig: 'configType2.js';
         }
   });
  </script>
Run Code Online (Sandbox Code Playgroud)

所以,我的问题是

  1. customConfig在这种情况下如何做?
  2. 哪里有"最完整的文档",关于配置菜单(editor.config.toolbar)没有在线配置工具,在哪里我可以理解如何使用正确的名称放置和删除菜单? 这里没有关于如何在完整安装中修复"Source"的错误.

我做,

git clone git://github.com/ckeditor/ckeditor-releases.git
cd ckeditor-releases
cp samples/inlineall.html samples/myinline.html 
Run Code Online (Sandbox Code Playgroud)

samples/myinline.html使用上面的代码进行编辑.

Rei*_*mar 9

  1. 对于内联编辑器,标准Source按钮是隐藏的,因为除了之外不可能有不同的模式wysiwyg.因此,对于那些编辑器,创建了新的插件 - sourcedialog,但默认情况下它不包含在任何构建中.您可以使用在线CKBuilder或使用带参数的预设之一来使用此插件构建编辑器all.例如:./build.sh full all.还记得加载sourcedialog插件(使用config.extraPlugins = 'sourcedialog').

  2. 如果您想自由配置内联编辑器,那么您应该看一下inlinebycode示例.首先,您需要在可编辑元素上禁用自动编辑器初始化,然后调用CKEDITOR.inline()要成为编辑器的元素:

    // We need to turn off the automatic editor creation first.
    CKEDITOR.disableAutoInline = true;
    
    CKEDITOR.inline( 'editable1', {
        customConfig: 'editableConfig.js'
    } );
    CKEDITOR.inline( 'editable1', {
        toolbar: [ ... ]
    } );
    
    Run Code Online (Sandbox Code Playgroud)