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();