CKEditor Plugin

  • 24 September 2017
  • GeeX

CKEditor Plugin

Fügt einen Custom Button dem CKEditor hinzu.

Bei Klick wird Custom Text eingefügt.

ckeditor/plugins/hello/plugin.js

(function(){
//CKeditor hello Button
CKEDITOR.plugins.add('hello',
    {
    icons: 'logo',
        init: function (editor) {
            var pluginName = 'hello';
            editor.ui.addButton('hello',
                {
                    label: 'Hallo',
                    command: 'OpenWindow1',
//Kann anders heissen
icon : this.path + 'icons/hello.png',
                });
            var cmd = editor.addCommand('OpenWindow1', { exec: showMyDialog1 });
        }
    });
    function showMyDialog1(e) {
        e.insertHtml('<p>Hallo, dieser Text wird in CKeditor eingefügt!</p></br>');
    }
})();

ckeditor.config.js

CKEDITOR.editorConfig = function( config )
{
    config.extraPlugins = 'hello';
    config.toolbar = 'MyToolbar';

    config.toolbar_MyToolbar =
    [
        ['Save','-','Source','Preview','-','Templates'],
        ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],
        ['Undo','Redo','-','Find','Replace'],
        ['Link','Unlink','Anchor'],
        '/',       
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote','CreateDiv'],
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
        ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
         '/',
        ['Styles','Format','Font','FontSize'],
        ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
        ['Maximize'],
         '/',
        ['hello']
        ,
    ];
};