Для одного из наших клиентов мы создали упрощенный диалог изображения при использовании полного редактора WYSIWYG в бэкэнде Directus.

Наш заказчик не заинтересован во вставке внешних изображений в текст, но хочет выбирать изображения, уже загруженные в Directus. Есть список изображений, который можно включить в настройках столбца таблицы. Перейдите в настройки столбца - ›параметры интерфейса и прокрутите вниз.

К сожалению, этот основной список изображений показывает только список заголовков. Наш клиент хочет видеть эскизы изображений. Поэтому мы заменили стандартный плагин изображений прилагаемого редактора tinyMce на собственный. Этот плагин выглядит так:

Когда вы нажимаете на изображение, оно отправляется в редактор:

Чтобы использовать настраиваемый плагин, просто скопируйте plugin.min.js и styles.css из github в assets / js / vendor / tinymce / plugins / image. Включите плагин image в app / core / interfaces / wysiwyg_full / interface.js. Вот и все.

Вот и все. Репозиторий: https://github.com/EcoLogicAG/tiny-images

Чтобы использовать плагин в качестве дополнительного, можно переименовать плагин (а также идентификатор кнопки и меню) и добавить его как новый плагин в app / core / interfaces / wysiwyg_full / interface.js (необходимо добавить в плагины и свойства панели инструментов.)