CKEDITOR - предотвратите добавляющие размеры изображения как стиль css

Я не верю, что вы можете сделать это без изменения плагина изображения CKEDITOR...

Если вы будете искать их сайт отслеживания ошибок, вы увидите, что они пытаются "избежать XHTML устаревших атрибутов" в пользу стиля. ( Избегайте устаревших атрибутов изображения )

Местом для поиска, если Вы хотите сделать это самостоятельно (путем изменения исходных файлов) является этот файл : plugins_image_dialogs_image.js. Там вы увидите, что они специально удаляют атрибут и добавляют эквивалент стиля.

Эй, я разобрался! Я создал здесь аккаунт только для того, чтобы опубликовать это для всех вас. Я не использую его для рассылки Outlook, но он все равно должен работать, потому что он добавляет атрибуты высоты и ширины к тегам img.

Если мы когда-нибудь захотим сделать это снова, вот как я это сделал.

Сначала я нашел несколько полностью отформатированных и прокомментированных исходных файлов:

http://dev.fckeditor.net/browser/CKEditor/tags/3.2/_source/plugins/image/dialogs/image.js

Итак, я извлек исходник plugins/image/dialogs/image.js:

svn co http://svn.fckeditor.net/CKEditor/tags/3.2/_source/plugins/image/dialogs

Если у вас есть номера строк в каждой строке, потому что вы не скачивали его, а просто скопировали, вы можете удалить их, выполнив эту команду (из терминала Linux):

cut -c 5- image.js > image2.js

Или просто нажмите ссылку Original Format внизу страницы по 1-й ссылке выше.

Теперь у нас есть чистый исходный файл, готовый к редактированию.

Оригинальная упакованная версия была 19k в той, что была у меня. Распакованный исходный код был 45k. Но это в любом случае должно загружаться только когда кто-то что-то редактирует и не должно быть проблемой. Если это так, то просто перепакуйте ее.

Версия, которая была у меня, может отличаться от той, которая есть у вас, поэтому я покажу вам, какие строки я изменяю и что я с ними сделал.

Замените строки 636-641:

if ( value )
    element.setStyle( 'width', CKEDITOR.tools.cssLength( value ) );
else if ( !value && this.isChanged( ) )
    element.removeStyle( 'width' );

!internalCommit && element.removeAttribute( 'width' );

на:

if ( value ) {
    element.setStyle( 'width', CKEDITOR.tools.cssLength( value ) );
    element.setAttribute( 'width', value );
} else if ( !value && this.isChanged( ) ) {
    element.removeStyle( 'width' );
    element.removeAttribute( 'width' );
}

//!internalCommit && element.removeAttribute( 'width' );

Замените строку 653 (657 после вышеуказанных правок):

element.setStyle( 'width', value + 'px');

на:

element.setStyle( 'width', value + 'px');
element.setAttribute( 'width', value );

Замените строки 686-692 (691-697 после вышеуказанных правок):

if ( value )
    element.setStyle( 'height', CKEDITOR.tools.cssLength( value ) );
else if ( !value && this.isChanged( ) )
    element.removeStyle( 'height' );

if ( !internalCommit && type == IMAGE )
    element.removeAttribute( 'height' );

на:

if ( value ) {
    element.setStyle( 'height', CKEDITOR.tools.cssLength( value ) );
    element.setAttribute( 'height', value );
} else if ( !value && this.isChanged( ) ) {
    element.removeStyle( 'height' );
    element.removeAttribute( 'height' );
}

//if ( !internalCommit && type == IMAGE )
//  element.removeAttribute( 'height' );

Замените строку 704 (712 после вышеуказанных правок):

element.setStyle( 'height', value + 'px' );

на:

element.setStyle( 'height', value + 'px' );
element.setAttribute( 'height', value );

Единственная загвоздка в том, что это не работает, когда вы перетаскиваете контрольные точки для изменения размера. Я не смог разобраться с этой частью. После перетаскивания контрольных точек для изменения размера просто откройте Свойства изображения и нажмите OK, и оно снова добавит атрибуты ширины и высоты.