History of CKEditor
! CKeditor
++yellow:Still needs a little work tidying things up to the current version of ckeditor++
__CKeditor is a rich text editor__. This means, input areas for content will look like an Office program. Users mark some text, then click on a __button B__ or hit __Ctrl+B__ on their keyboard, and instantly see the marked text bold. It is browser independent, written in Javascript, and released as Open Source by [http://http://ckeditor.com/|ckeditor.com]. Alternatively, you can use ((TinymcePackage|TinyMCE)), another rich text editor that can easily be integrated with Bitweaver.
! How to enable CKeditor in Bitweaver
# Enable Bitweaver's CKeditor package: your Bitweaver > -+Admin > Kernel > Packages+-.
# Enable HTML in -+Admin > Liberty > Plugins > Format+-. Consider setting HTML as ''default'' format.
# Enable the ability to input HTML for the user group of your choice in -+Admin > Users > Groups & Permissions+-.
# If using html editor as the default it then both quicktags and smileys
packages should be disabled as these facilities are provided within ckeditor.
! Features
* __Multiple Browser Support__, including Internet Explorer 5.5+, Firefox, Mozilla, Netscape, Opera, Safari
* __XHTML 1.0 Output__
* __CSS Support:__ For easier integration with a theme.
* __Font formatting:__ type, size, color, style, bold, italic, etc
* __Text formatting:__ alignment, indentation, bullets list, etc
* Cut, Paste and Paste as Plain Text, Undo and Redo
* Paste from __Word__ cleanup with auto detection
* Link and anchors support
* Table creation and editing (add, delete rows, etc) - one of the best systems in the market.
* Table cells editing (size, colors, etc)
* Right click context menus support
* Support for Toolbar Customization
* Skins
* Spell Checker Integration
* Automatic browser detection and customization
* Full Page Mode
* Easy to Use
* Source Code View
! Toolbars
Bitweaver includes the ability to use one of several toolbars with CKeditor easily. It is also possible to customize the toolbar by editing the ckeditor/ckconfig.bitweaver.js file to specify your own and then adding it to ckeditor/admin/))admin_ckeditor_inc((.php.
! Skins
Bitweaver includes the ability to skin the interface with one of the three default skins. It is also possible to create your own skin. You will have to add it to the ckeditor/admin/))admin_ckeditor_inc((.php file to add it to the administration interface.
! Other Configuration Settings
[http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html|CKEditor configure file elements] This document can be used to identify elements that you may want to reconfigure. ((CKEditor Configuring))
! Issues
* __CKeditor is currently NOT compatible with the feature ''Ajax Comments'' in -+Admin > Liberty > Comments+-.__
! Your own plugins for CKeditor
If you want to write your own plugin for CKeditor, here are two good tutorials to get you started:
* [http://www.voofie.com/content/2/ckeditor-plugin-development/|CKEditor Plugin Development
* [http://syrinx.ph/articles/CkEditorPluginGuide.aspx|Building Custom CK Editor Plug-ins
! Bitweaver's plugins for CKeditor
!! Split
++yellow:TODO - Check out plugin++
The Split plugin gives you a button that will insert a split tag:...split... into your content. This is good for blog posts and articles where you want to easily define a read more section. Now your users don't need to know how to use ...split... they can just click the "Insert Split" button, which includes a hover tool tip letting you know it is for adding a Read More section.
!! Attachment
++yellow:TODO - check out plugin++
The Attachment plug inintegrates bitweaver's native LibertyAttachments features
{code title="/ckeditor/config.js"}
// add or uncomment:
CKConfig.Plugins.Add( 'attachment' ) ;
{/code}
Now you need to add Attachment to your toolbar list, for example like:
{code title="/ckeditor/ckconfig.bitweaver.js"}
CKEDITOR.editorConfig = function( config ) {
config.toolbar_Beginner = [
['Bold','Italic','Underline'],
['NumberedList','BulletedList'],
['Link','Unlink','Anchor'],
['Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
['Maximise','-','About']
];
};
{/code}
++yellow:Still needs a little work tidying things up to the current version of ckeditor++
__CKeditor is a rich text editor__. This means, input areas for content will look like an Office program. Users mark some text, then click on a __button B__ or hit __Ctrl+B__ on their keyboard, and instantly see the marked text bold. It is browser independent, written in Javascript, and released as Open Source by [http://http://ckeditor.com/|ckeditor.com]. Alternatively, you can use ((TinymcePackage|TinyMCE)), another rich text editor that can easily be integrated with Bitweaver.
! How to enable CKeditor in Bitweaver
# Enable Bitweaver's CKeditor package: your Bitweaver > -+Admin > Kernel > Packages+-.
# Enable HTML in -+Admin > Liberty > Plugins > Format+-. Consider setting HTML as ''default'' format.
# Enable the ability to input HTML for the user group of your choice in -+Admin > Users > Groups & Permissions+-.
# If using html editor as the default it then both quicktags and smileys
packages should be disabled as these facilities are provided within ckeditor.
! Features
* __Multiple Browser Support__, including Internet Explorer 5.5+, Firefox, Mozilla, Netscape, Opera, Safari
* __XHTML 1.0 Output__
* __CSS Support:__ For easier integration with a theme.
* __Font formatting:__ type, size, color, style, bold, italic, etc
* __Text formatting:__ alignment, indentation, bullets list, etc
* Cut, Paste and Paste as Plain Text, Undo and Redo
* Paste from __Word__ cleanup with auto detection
* Link and anchors support
* Table creation and editing (add, delete rows, etc) - one of the best systems in the market.
* Table cells editing (size, colors, etc)
* Right click context menus support
* Support for Toolbar Customization
* Skins
* Spell Checker Integration
* Automatic browser detection and customization
* Full Page Mode
* Easy to Use
* Source Code View
! Toolbars
Bitweaver includes the ability to use one of several toolbars with CKeditor easily. It is also possible to customize the toolbar by editing the ckeditor/ckconfig.bitweaver.js file to specify your own and then adding it to ckeditor/admin/))admin_ckeditor_inc((.php.
! Skins
Bitweaver includes the ability to skin the interface with one of the three default skins. It is also possible to create your own skin. You will have to add it to the ckeditor/admin/))admin_ckeditor_inc((.php file to add it to the administration interface.
! Other Configuration Settings
[http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html|CKEditor configure file elements] This document can be used to identify elements that you may want to reconfigure. ((CKEditor Configuring))
! Issues
* __CKeditor is currently NOT compatible with the feature ''Ajax Comments'' in -+Admin > Liberty > Comments+-.__
! Your own plugins for CKeditor
If you want to write your own plugin for CKeditor, here are two good tutorials to get you started:
* [http://www.voofie.com/content/2/ckeditor-plugin-development/|CKEditor Plugin Development
* [http://syrinx.ph/articles/CkEditorPluginGuide.aspx|Building Custom CK Editor Plug-ins
! Bitweaver's plugins for CKeditor
!! Split
++yellow:TODO - Check out plugin++
The Split plugin gives you a button that will insert a split tag:...split... into your content. This is good for blog posts and articles where you want to easily define a read more section. Now your users don't need to know how to use ...split... they can just click the "Insert Split" button, which includes a hover tool tip letting you know it is for adding a Read More section.
!! Attachment
++yellow:TODO - check out plugin++
The Attachment plug inintegrates bitweaver's native LibertyAttachments features
{code title="/ckeditor/config.js"}
// add or uncomment:
CKConfig.Plugins.Add( 'attachment' ) ;
{/code}
Now you need to add Attachment to your toolbar list, for example like:
{code title="/ckeditor/ckconfig.bitweaver.js"}
CKEDITOR.editorConfig = function( config ) {
config.toolbar_Beginner = [
['Bold','Italic','Underline'],
['NumberedList','BulletedList'],
['Link','Unlink','Anchor'],
['Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
['Maximise','-','About']
];
};
{/code}