WYSIWYG редактор TinyMCE
Стандартный редактор Joomla! - для подключения достаточно этого:
<script src="/media/editors/tinymce/tinymce.min.js" type="text/javascript"></script>
В примере ниже сперва выполняется разблокировка элементов формы, лежащих за пределами модального окна bootstrap (можно опустить, если bootstrap или его модальные окна не используются). Если не отключить, то в модальных окнах всплывающие окошки редактора не будут нормально работать.
Следующая строка удаляет проинициализированные ранее окна самого редактора - без этого повторная инициализация нормально работать не будет.
А третья строка - собственно, инициализация редактора на элементах textarea:
jQuery(document).off('focusin.modal');
tinyMCE.remove();
tinyMCE.init({
selector: '#bsModalArticle .item-text, #bsModalArticle .item-intro',
language: 'ru',
plugins : 'advlist code image lists table wordcount link',
toolbar: 'code | image | link | table | bullist numlist | formatselect | alignleft aligncenter alignright alignjustify | bold italic underline strikethrough superscript subscript',
menubar: false
});
чтоб не резало ссылки, надо добавить (возможно, один из):
relative_urls: false,
remove_script_host: false,
Здесь меню отключено, а все необходимые функции выведены на тулбар в виде кнопок.
ВНИМАНИЕ! Копирование текста из редактора в textarea происходит по событию submit формы. Это надо учитывать при реализации ajax-отправки формы. Редактор должен быть инициализирован ДО навешивания на форму события, выполняющего отправку.
Принудительно вынуть текст из редактора можно так:
var myContent = tinymce.get("myTextarea").getContent();
или так:
var myContent = tinymce.activeEditor.getContent();