Simplification of CKEditor

[GoogleCodeExporter]

Enhancement 3.0 / can be applied to 3.1

I have made changes to CKEditor to make it more user friendly and simple to 
use. Users were overwhelmed with default setting.

Screenshots attached.

Remove all unneeded tabs from link and image menu (overwhelmed users):

CODE:

**************

CKEDITOR.on( 'dialogDefinition', function( ev )

    {
        var dialogName = ev.data.name;
        var dialogDefinition = ev.data.definition;
        ev.data.definition.resizable = CKEDITOR.DIALOG_RESIZE_NONE;

        if ( dialogName == 'link' )

        {
            var infoTab = dialogDefinition.getContents( 'info' );
            dialogDefinition.removeContents( 'target' );
            dialogDefinition.removeContents( 'advanced' );
        }

        if ( dialogName == 'image' )
        {
            dialogDefinition.removeContents( 'Link' );
            dialogDefinition.removeContents( 'advanced' );
            var infoTab = dialogDefinition.getContents( 'info' );
            infoTab.remove( 'txtBorder' );
            infoTab.remove( 'txtHSpace' );
            infoTab.remove( 'txtVSpace' );
            infoTab.remove( 'cmbAlign' );
        }

**************

Modify menu to reduce options and include needed tools. - People don't know 
about Ctrl+Z, and sometimes need full screen to write.
Blocks added, as text is formatted by CSS.
_Consider removing underline, it is not recommended to use it, accessibility 
wise._

CODE:

**************

# WYSIWYG toolbars (advanced, basic or [custom config])
# 'Outdent','Indent', 'Undo','Redo',
define('GSEDITORTOOL',"['Bold', 'Italic', 'Underline', 'NumberedList', 
'BulletedList', 'Format', 'Link', 'Unlink', 'Image', 'Undo', 'RemoveFormat', 
'Maximize', 'ShowBlocks', 'Source']");

**************

Modify formatting toolbar to have only H3 and H4 + normal. Page title should 
always be H1, and H2 is page title, thus h3 and h4.

CODE:
**************

# WYSIWYG Editor Options
define('GSEDITOROPTIONS',"format_tags:'p;h3;h4'");

**************

Original issue reported on code.google.com by borislav...@gmail.com on 6 Feb 2012 at 12:22

Attachments:

• ckeditor-modify.gif
• ckeditor-modify-link.gif
• ckeditor-modify-image.gif

[GoogleCodeExporter]

Thanks for this, i like removing stuff that is not needed.

Original comment by ccagle8 on 6 Feb 2012 at 1:41

• Changed state: Accepted
• Added labels: Type-Enhancement
• Removed labels: Type-Defect

[GoogleCodeExporter]

No problems, glad it helped.

You will need to override CKE CSS, as by default Format is not intended to go 
in one row with other icons.

Original comment by borislav...@gmail.com on 6 Feb 2012 at 2:14

[GoogleCodeExporter]

i used some of your code...thanks

Original comment by ccagle8 on 19 Feb 2012 at 3:11

• Changed state: Fixed

[GoogleCodeExporter]

Glad it helped! :-)

Original comment by borislav...@gmail.com on 19 Feb 2012 at 9:37

[GoogleCodeExporter]

:-? In r660 I only see a blank line has been inserted.

Original comment by carnav on 19 Feb 2012 at 10:27