將ckeditor小部件添加到自定義工具欄

Question

我正在嘗試將占位符小部件添加到我的自定義工具欄中 -對於我的一生，我不知道如何：

<script src="https://cdn.ckeditor.com/4.5.2/standard-all/ckeditor.js"></script>

它適用於默認工具欄：

<textarea cols="80" id="editor1" name="editor1" rows="10">test1</textarea>

CKEDITOR.replace( 'editor1', {
  extraPlugins: 'placeholder',
  height: 50
} );

但不能使用自定義工具欄：

<textarea cols="80" id="editor2" name="editor2" rows="10">test2</textarea>

CKEDITOR.replace( 'editor2', {
  extraPlugins: 'placeholder',
  height: 50,
  toolbar: [{ name: 'tools',group: 'tools', items: [ 'Bold','Placeholder', 'Redo' ], groups: [ 'tools'] }]
} );

據我了解，有兩種方法可以將按鈕插入工具欄：1.在工具欄本身中使用名稱（編輯器2示例）2.使用editor.ui.addButton函數：

editor.ui.addButton && editor.ui.addButton( 'CreatePlaceholder', {
                label: lang.toolbar,
                command: 'placeholder',
            //  toolbar: 'insert,5',
                toolbar: 'clipboard,0',
                icon: 'placeholder'
            } );

我創建了一個小提琴來顯示：

1. 帶占位符按鈕的默認工具欄
2. 我無法向其添加占位符按鈕的自定義工具欄

您能告訴我/如何告訴我如何向自定義工具欄添加占位符嗎？ 謝謝

Answer 1

您已將按鈕命名為“ CreatePlaceholder”，因此應在工具欄中使用此名稱。

editor.ui.addButton && editor.ui.addButton( 'CreatePlaceholder', ...

CKEDITOR.replace( 'editor3', {
    ...
    toolbar: [{ name: 'tools',group: 'tools', items: [ 'Bold','CreatePlaceholder', ...

完整代碼： http ： //jsfiddle.net/nw3o4gy5/

還要看看CKEDITOR.ui.addButton 。