How to configure CKEditor-4 built-in editors?

Question

I have a standard installation (e.g. 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 with a local or 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

• How to make customConfig in this context?
• Where is the "most complete complete documentation" about the configuration menu ( editor.config.toolbar ) without an interactive configuration tool, where can I understand how to install and remove the itens menu with the correct names? Nothing here on how to fix the "Source" error in a full installation.

---

I AM,

 git clone git://github.com/ckeditor/ckeditor-releases.git cd ckeditor-releases cp samples/inlineall.html samples/myinline.html 

and edit samples/myinline.html using the code above.

Answer 1

• For built-in editors, the standard Source button is hidden because it is not possible to use different modes except wysiwyg . Therefore, a new plugin was created for these editors - sourcedialog , but by default it is not included in any of the collections. You can create an editor using this plugin using the online CKBuilder or using one of the presets with the all parameter. For example: ./build.sh full all . Remember also to download the sourcedialog plugin (using config.extraPlugins = 'sourcedialog' ).

• If you want to customize the built-in editors freely, you should take a look at the inlinebycode sample. First you need to disable the automatic initialization of editors on editable elements, and then call CKEDITOR.inline() for the 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: [ ... ] } );