Adding external plugins for CKeditor in WP

Hi @senfgurke, I found some time to check the issue you’re having.

I’ve started from scratch with a fresh WordPress copy, installed it and added CKEditor for WordPress plugin.

Then downloaded those plugins you’ve mentioned, and unpacked them into wp-content/plugins/ckeditor-for-wordpress/ckeditor/plugins. I had to create cssanim folder manually and unzip the plugin inside it as it doesn’t contain it. Others were fine – so I just unzipped it.

Next step was to add those plugins to the wp-content/plugins/ckeditor-for-wordpress/ckeditor.config.js file, like this:

$ cat ckeditor.config.js
/*
Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or http://ckeditor.com/license
*/

/**
 * Documentation:
 * http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html
 */

CKEDITOR.editorConfig = function(config) {
        // The minimum editor width, in pixels, when resizing it with the resize handle.
        config.resize_minWidth = 450;

        // Protect PHP code tags (<?...?>) so CKEditor will not break them when
        // switching from Source to WYSIWYG.
        config.protectedSource.push(/<\?[\s\S]*?\?>/g);

        // Define toolbars, you can remove or add buttons.
        // List of all buttons is here: http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.toolbar_Full

        // WordPress basic toolbar
        config.toolbar_WordpressBasic = [
                { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Strike', '-', 'RemoveFormat' ] },
                { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'Blockquote', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight'] },
                { name: 'links', items: [ 'Link', 'Unlink' ] },
                { name: 'insert', items: [ 'Image', 'SpecialChar' ] }
        ];

        // The equivalent of "WordPressFull" toolbar, defined in a way that makes adding buttons from plugins easier.
        config.toolbarGroups = [
                { name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
                { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
                { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
                // { name: 'forms' },
                '/',
                { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
                { name: 'links' },
                { name: 'insert' },
                { name: 'wordpress' },
                '/',
                { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
                { name: 'styles' },
                { name: 'colors' },
                { name: 'tools' },
                { name: 'about' }
        ];

        // Remove buttons in "WordPressFull" toolbar
        config.WordpressFull_removeButtons = 'Save,NewPage,Preview,Print,Templates,CreateDiv,PageBreak,Styles';

        //IE: remove border of image when is as a link
        config.extraCss = "a img { border: 0px\\9; }";

        config.extraPlugins += (config.extraPlugins ? ',youtube,fontawesome,cssanim' : 'youtube,fontawesome,cssanim' );
};

I’ve just added this line:
config.extraPlugins += (config.extraPlugins ? ',youtube,fontawesome,cssanim' : 'youtube,fontawesome,cssanim' );

And that’s all. I see all of them working inside the CKEditor.

• This reply was modified 7 years, 11 months ago by vokiel.

Great you’ve managed to solve it!

If you think this issue can be closed, please do so.