Here you go. dialogDefinition event solves the problem: CKEDITOR.on( ‘dialogDefinition’, function( ev ) { var dialogName = ev.data.name; var dialogDefinition = ev.data.definition; if ( dialogName == ‘table’ ) { var info = dialogDefinition.getContents( ‘info’ ); info.get( ‘txtWidth’ )[ ‘default’ ] = ‘100%’; // Set default width to 100% info.get( ‘txtBorder’ )[ ‘default’ ] = ‘0’; … Read more
You got to observe dialogDefinition event to do this: CKEDITOR.on( ‘dialogDefinition’, function( evt ) { var dialog = evt.data; if ( dialog.name == ‘link’ ) { // Get dialog definition. var def = evt.data.definition; // Add some stuff to definition. def.addContents( { id: ‘custom’, label: ‘My custom tab’, elements: [ { id: ‘myField1’, type: ‘text’, … Read more
I finally got it work. It was much more simple and did not even involve MIME. The trick was to modify the image tags in the working HTML to include the base64 encoded image so that the src tag could use this format (here shown with a gif as example): src=”data:image/gif;base64,<base64 encoded image>” I already … Read more
Add the following to your config.js file for CKEditor: config.enterMode = CKEDITOR.ENTER_BR; Example: … CKEDITOR.editorConfig = function (config) { config.enterMode = CKEDITOR.ENTER_BR; … }; Details The configuration setting that controls this behavior is based on what you want to happen when the user presses Enter. Just in case someone who’s new to working with HTML … Read more
Dan’s answer got strange results for me, but minor change (in addition to typo fix) made it work: var range = me.editor.createRange(); range.moveToElementEditEnd( range.root ); me.editor.getSelection().selectRanges( [ range ] );
Answering my own question as it might help others. CKEditor 5 no longer comes with a configuration setting to change its height. The height can be easily controlled with CSS. There is one tricky thing though, if you use the Classic Editor: <div id=”editor1″></div> ClassicEditor .create( document.querySelector( ‘#editor1’ ) ) .then( editor => { // … Read more
Start by registering your custom browser/uploader when you instantiate CKEditor. You can designate different URLs for an image browser vs. a general file browser. <script type=”text/javascript”> CKEDITOR.replace(‘content’, { filebrowserBrowseUrl : ‘/browser/browse/type/all’, filebrowserUploadUrl : ‘/browser/upload/type/all’, filebrowserImageBrowseUrl : ‘/browser/browse/type/image’, filebrowserImageUploadUrl : ‘/browser/upload/type/image’, filebrowserWindowWidth : 800, filebrowserWindowHeight : 500 }); </script> Your custom code will receive a GET … Read more