Я использую CKEditor 3.5 для редактирования WYSYWYG на веб-сайте. При вставке изображения вы можете предоставить ширину и высоту изображения, что приводит к следующему HTML:
<img alt="" src="/Images/Sample.png" style="width: 62px; height: 30px; " />
Так как это изменение размера в браузере и в других местах на одном и том же веб-сайте, я использую модуль изменения изображения Nathanael Jones, я бы например, получить следующий вывод:
<img alt="" src="Images/Sample.png?width=62&height=30" />
Есть ли простой способ управления сгенерированным HTML или я действительно должен написать свой собственный диалог/плагин для CKEditor?
EDIT:
Добавление следующих строк в config.js было решением, которое в конечном итоге сработало для меня:
CKEDITOR.on('dialogDefinition', function (ev) {
var dialogName = ev.data.name;
var dialogDefinition = ev.data.definition;
var dialog = dialogDefinition.dialog;
var editor = ev.editor;
if (dialogName == 'image') {
dialogDefinition.onOk = function (e) {
var imageSrcUrl = e.sender.originalElement.$.src;
var width = e.sender.originalElement.$.width;
var height = e.sender.originalElement.$.height;
var imgHtml = CKEDITOR.dom.element.createFromHtml('<img src=' + imageSrcUrl + '?width=' + width + '&height=' + height + ' alt="" />');
editor.insertElement(imgHtml);
};
}
});
Следующая проблема заключается в том, что при редактировании изображения ширина и высота, естественно, находятся в поле URL и отсутствуют в выделенных полях для ширины и высоты. Поэтому мне нужно придумать решение для обратного...: -)