ckeditor - Loại bỏ các input width, height khi đăng ảnh

1. Trong file ckeditor4.18.0/config.js, bạn thêm đoạn sau:

CKEDITOR.on('instanceReady', function(evt) {
    var editor = evt.editor;

    // Xóa width, height, và style inline của ảnh
    editor.dataProcessor.htmlFilter.addRules({
        elements: {
            img: function(el) {
                if (el.attributes) {
                    delete el.attributes.width;
                    delete el.attributes.height;

                    // Nếu có style thì xóa width/height trong style
                    if (el.attributes.style) {
                        el.attributes.style = el.attributes.style
                            .replace(/(?:\s*width\s*:\s*[^;]+;?)/gi, '')
                            .replace(/(?:\s*height\s*:\s*[^;]+;?)/gi, '');

                        // Xóa style nếu rỗng
                        if (el.attributes.style.trim() === '') {
                            delete el.attributes.style;
                        }
                    }
                }
                return el;
            }
        }
    });
});

2. Ở trang có dùng ckeditor, bạn thêm 2 dòng style sau

.cke_dialog_contents_body .cke_dialog_ui_hbox_first{display: none !important}
.cke_dialog_contents_body .ImagePreviewBox{width: 100% !important}
Bình luận
Zalo