Search code examples
javascriptckeditorckeditor4.x

How to remove "height" setting for images in CKEditor 4


I need to remove "Height" setting for images in CKEditor 4. I mean that users will be allowed ONLY to enter "Width". Simple hiding "Height" in HTML is not enough as CK Editor 4 will add height in CSS anyway. I need it to stop adding height at all and hide this option. "Lock proportions" icon should be gone and "Restore size" icon should be working but setting only width as well. How can I do this? Thanks a lot :-)


Solution

  • Please try below code:

    var editor = CKEDITOR.replace( 'editor1', {
        disableObjectResizing : true
    });
    CKEDITOR.on( 'dialogDefinition', function( ev ) {
        var dialogName = ev.data.name;
        var dialogDefinition = ev.data.definition;
        var  editorO = ev.data.definition.dialog.getParentEditor();
    
        if ( dialogName == 'image' || dialogName == 'image2' ) {
            var infoTab = dialogDefinition.getContents( 'info' );
    
            if( dialogName == 'image' ){
                infoTab.remove('txtHeight');
                infoTab.remove('ratioLock');
            }
            else{
                infoTab.remove('height');
                infoTab.remove('lock');
            }
        }
    });
    

    You need to look for id's in dialog files: