Froala Editor: внешняя панель инструментов, которая открывается как всплывающее окно при нажатии кнопки

Question

Мы используем последнюю версию Froala в нашем проекте и хотим настроить ее так, чтобы панель инструментов запускалась (всплывающее окно) с помощью кнопки, внешней по отношению к редактору. Редактор по умолчанию не должен иметь панели инструментов. Что-то очень похожее на Gmail.

Я попытался изменить пример «Custom Popup». Показывая пользовательское всплывающее окно с помощью внешней кнопки. Но чтобы это работало, панель инструментов должна быть видна всегда, чего мы не хотим. https://www.froala.com/wysiwyg-editor/docs/concepts/custom/popup

Ниже приведены скриншоты Gmail, которые дают хорошее представление о том, чего мы хотим достичь.

Шаг 1 - по умолчанию панель инструментов отсутствует

Шаг 2 - Панель инструментов показывает после нажатия кнопки

Answer 1

Я получил рабочее решение для этого.

Я использовал

1. Пользователь toolbarcontainer , чтобы поместить панель инструментов в другой элемент div вне редактора. https://www.froala.com/wysiwyg-editor/docs/options#toolbarContainer
2. Затем сделайте родительский div (который имел дочерний элемент панели инструментов) плавающим div, который может отображаться по мере необходимости с помощью кнопки с использованием простого CSS.

Это решение работает должным образом, даже если я щелкну в другой области панели инструментов страницы, не исчезнет

Надеюсь, мой ответ поможет и другим