単純なボタンを追加するCKEDITORは、このような難しいことはありません。

Question

CKEDITOR.plugins.add('Copyall', { 
init: function(editor) { 
    editor.addCommand('copy_all', { 
     exec : function(editor){ 
      alert('Yay!'); 
     } 
    }); 
    editor.ui.addButton('Copyall', { 
     label: 'Copy All', 
     command: 'copy_all', 
     toolbar: 'basicstyles', 
     icon: 'https://avatars1.githubusercontent.com/u/5500999?v=2&s=16' 
    }); 
} 
}); 

CKEDITOR.config.toolbar = [ 
{name: 'basicstyles', items : ['Copyall', 'Font', 'FontSize', 'Bold', 'Italic', 'Strike']}, 
]; 

私はインラインCKEDITOR要素のための簡単なメニューを持っています。私は単にjsの仕事をするためのボタンが必要です。

https://jsfiddle.net/elb_/as1km50L/

Answer 1

Gineあなたの編集可能なエリアへのid：次に

<div id="editor1" contenteditable="true">some text</div> 

、プラグインなしでコマンドやボタンを追加するためにあなたのIDを使用します。

CKEDITOR.instances.editor1.addCommand('copy_all', { 
    exec : function(editor) { 
     alert('Yay!'); 
    } 
}); 

CKEDITOR.instances.editor1.ui.addButton('Copyall', { 
    label: 'Copy All', 
    command: 'copy_all', 
    toolbar: 'basicstyles', 
    icon: 'https://avatars1.githubusercontent.com/u/5500999?v=2&s=16' 
}); 

CKEDITOR.config.toolbar = [ 
{name: 'basicstyles', items : ['Copyall', 'Font', 'FontSize', 'Bold', 'Italic', 'Strike']}, 
]; 

はこれを参照してください。 https://jsfiddle.net/as1km50L/1/

Answer 2

CKEDITOR.inlineAll(); 
for (var instanceName in CKEDITOR.instances) { 
    CKEDITOR.instances[instanceName].addCommand('copy_all', { 
     exec: function(edt) { 
      alert('Yay!'); 
     } 
    }); 

    CKEDITOR.instances[instanceName].ui.addButton('Copyall', { 
     label: 'Copy All', 
     command: 'copy_all', 
     toolbar: 'basicstyles', 
     icon: 'https://avatars1.githubusercontent.com/u/5500999?v=2&s=16' 
    }); 
} 

CKEDITOR.config.toolbar = [ 
    {name: 'basicstyles', items : ['Copyall', 'Font', 'FontSize', 'Bold', 'Italic', 'Strike']}, 
]; 

上記のCKEDITOR.inlineAll（）メソッドを参照してください。その美しさがなければ、CKEDITORのインスタンスはカスタマイズすることができません。 inlineAll（）がなければ、CKEDITOR.instancesはポピュレートされているように見えますが、なんらかの理由で反復することはできません。

とにかく、問題は解決しました。