Статья CKEditor 5

Автор - zabariap

Из подраздела - Код

CKEditor 5 — это современный JavaScript-фреймворк для работы с форматированным текстом (WYSIWYG). Он написан с нуля на TypeScript и построен на архитектуре MVC с пользовательской моделью данных и виртуальным DOM. Его ключевое преимущество — модульная, плагин-ориентированная архитектура, которая позволяет гибко настраивать редактор под конкретные задачи.

CKEditor 5 официально поддерживает многие фронтенд-библиотеки и фреймворки. Для них есть готовые пакеты, которые упрощают подключение.

Для работы с HTML-контентом в Django удобнее всего использовать пакет django-ckeditor-5 — это официальная и актуальная интеграция редактора CKEditor 5. Он позволяет добавлять в формы и админ панель удобный WYSIWYG-редактор с поддержкой форматирования текста, загрузки изображений, таблиц и блоков кода. 

Установка, подключение, внедрение в модели описаны в интернете, но при отображение полей с CKEditor5Field  воникает проблема с форматом изображений.

Создавая формы создания и редактирования полей модели применяется виджет 

widget.attrs.update({'class': 'django_ckeditor_5'})

Этот код добавляет CSS-классdjango_ckeditor_5к виджету поля формы в Django. Чаще всего его используют, чтобы корректно отобразить и инициализировать визуальный редактор CKEditor 5 в поле формы. 

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

Поис решений в интернете не дал результатов, но в некоторых учебных материалах с примерами эта проблема не возникала.

Анализируя коды примеров, обратил внимание на атрибут