I have a standard installation (like samples):
<meta charset="utf-8"></meta>
<script src="../ckeditor.js"></script>
With HTML content with many <div contenteditable="true">
blocks. I need to configure each editor by local or an external configTypeX.js
file,
<script>
CKEDITOR.on( 'instanceCreated', function( event ) {
var editor = event.editor, element = editor.element;
if ( element.is( 'h1', 'h2', 'h3' ) ) {
editor.on( 'configLoaded', function() {
editor.config.toolbar = [
[ 'Source', '-', 'Bold', 'Italic' ]
]; // BUG: about "Source"?? NOT AT INTERFACE!
});
} else {
// WHERE PUT THIS ITEM?
customConfig: 'configType2.js';
}
});
</script>
So, my problem is
customConfig
in this context?editor.config.toolbar
) without online configuration-tool, where I can understand how to put and remove menu itens with correct names? Here nothing about how to fix the bug of 'Source' in a full installation.I do,
git clone git://github.com/ckeditor/ckeditor-releases.git
cd ckeditor-releases
cp samples/inlineall.html samples/myinline.html
and edit samples/myinline.html
with the code above.
CKEditor 4 comes with a rich set of configuration options that make it possible to customize its appearance, features, and behavior. The main configuration file is named config. js . This file can be found in the root of the CKEditor 4 installation folder.
Inline Editing is a new technology introduced in CKEditor 4 that allows you to select any editable element on the page and edit it in-place. As a result, the editor can be used to edit content that looks just like the final page.
Classic Editor with Default Source Editing Area Source editing is provided by the Source Editing Area plugin. Follow the steps below to try it out: Click the Source button to display the HTML source of this text in the source editing area. Click the Source button again to return to the WYSIWYG view.
For inline editors the standard Source
button is hidden, because it is not possible to have different modes other than wysiwyg
. Therefore for those editors new plugin was created - sourcedialog, but it is not included in any of builds by default. You can build editor with this plugin using online CKBuilder or by using one of presets with all
parameter. For example: ./build.sh full all
. Remember also to load sourcedialog
plugin (using config.extraPlugins = 'sourcedialog'
).
If you want to freely configure inline editors, then you should take a look at inlinebycode sample. First you need to disable automatic editors initialization on editable elements and then call CKEDITOR.inline()
on elements you want to become editors:
// We need to turn off the automatic editor creation first.
CKEDITOR.disableAutoInline = true;
CKEDITOR.inline( 'editable1', {
customConfig: 'editableConfig.js'
} );
CKEDITOR.inline( 'editable1', {
toolbar: [ ... ]
} );
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With