CKEditor Samples
Basic Samples
Replace textarea elements by class name
Automatic replacement of all textarea elements of a given class with a CKEditor instance.
Replace textarea elements by code
Replacement of textarea elements with CKEditor instances by using a JavaScript call.
Create editors with jQuery
New!
Creating standard and inline CKEditor instances with jQuery adapter.
Basic Customization
User Interface color
Changing CKEditor User Interface color and adding a toolbar button that lets the user set the UI color.
User Interface languages
Changing CKEditor User Interface language and adding a drop-down list that lets the user choose the UI language.
Inline Editing
New!
Massive inline editor creation
New!
Turn all elements with
contentEditable = true
attribute into inline editors.
Convert element into an inline editor by code
New!
Conversion of DOM elements into inline CKEditor instances by using a JavaScript call.
Replace textarea with inline editor
New!
A form with a textarea that is replaced by an inline editor at runtime.
Advanced Samples
Data filtering and features activation
New!
Data filtering and automatic features activation basing on configuration.
Replace DIV elements on the fly
Transforming a
div
element into an instance of CKEditor with a mouse click.
Append editor instances
Appending editor instances to existing DOM elements.
Create and destroy editor instances for Ajax applications
Creating and destroying CKEditor instances on the fly and saving the contents entered into the editor window.
Basic usage of the API
Using the CKEditor JavaScript API to interact with the editor at runtime.
XHTML-compliant style
Configuring CKEditor to produce XHTML 1.1 compliant attributes and styles.
Read-only mode
Using the readOnly API to block introducing changes to the editor contents.
"Tab" key-based navigation
New!
Navigating among editor instances with tab key.