Установка, настройка и кастомизация редактора TinyMCE Rich Text Editor

Сегодня в телеграм канале MODX написали о том, что редактор TinyMCE Rich Text Editor не умеет то, не умеет этого. Кто-то не сумел его настроить, у кого-то он выдавал ошибки и т.д. Вопрос выбора редактора для меня встал сразу как я перешел на MODX (что напомню случилось не так давно, месяцев 8 назад). Задача стояла одна: сделать простой, удобный и многофункциональный редактор контента. Поигрался с обычным TinyMCE, поигрался с ckeditor, поигрался с TinyMCE Rich Text Editor и решил ковырять последний.

Я не хочу устраивать холивар, какой мол, редактор лучше. Я делюсь готовым решением рабочего и многофункционального редактора. А какой выбирать — решать конечно вам.

История

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



Описывать все функции я не буду, вы их видите на скриншоте выше и сами сможете пощупать. На основе компонента Ильи Уткина siteExtra, я сделал свою сборку для быстрого развертывания чистого MODX с уже установленными нужными мне настройками. В том же телеграм чате меня попросили поделиться конфигами моего редактора но я решил поступить проще. На основе того же компонента Ильи, я сварганил на скорую руку автоустановщик уже настроенного редактора TinyMCE Rich Text Editor, он включает в себя весь функционал который я сумел настроить. И ничего более. Только чистая установка редактора и его настройка. Никаких других компонентов / настроек / объектов он не устанавливает.

Сборка прошла без ошибок.

Установка

1) Скачать автоустановщик вы можете с моего новосозданного Git-репозитория.

2) Процесс установки очень прост — закидываем файл tinymcerte-1.0.0-beta.transport.zip в ../core/packages/ и через установщик ищем пакет локально. Далее просто устанавливаем его. Настройки автоустановщик установит сам.

3) В папке /files/TinyMCERTE-settings/, вы можете найти небольшой readme.txt и плагин typograf, который нужно поместить в папку плагинов редактора (об этом читайте в readme.txt). На этом все — редактор готов к использованию.

Предостережения и доработка

1) Я тестировал данный автоустановщик на чистом сайте и сайте без установленного редактора. Как и что произойдет, если установить его на сайт где уже есть редактор (Ace не в счет), я не знаю.

2) Было бы неплохо автоматически помещать папку typograf в нужный раздел, но моих знаний не хватает для реализации этой идеи. Если кто-то захочет помочь — будет круто. Исходники данного автоустановщика я выложу в тот же репозиторий сегодня, но ближе к вечеру.

4) Для проверки орфографии редактор использует сервис yandex.speller. Настройки сервиса вы можете найти в файле ../assets/components/tinymcerte/tinymcerte/js/external-config.json. Spellchecker TinyMCE поддерживает огромное кол-во языков для проверки. Тогда как yandex.speller только 3 (русский, украинский, английский).

"link_class_list": [{
    "title": "Увеличение при клике",
    "value": "image-popup"
}]

'convert_urls' => $this->tinymcerte->getOption('convert_urls', array(), true) == 1,

[{"title": "Header 2", "format": "h2"},
 {"title": "Header 3", "format": "h3"},
 {"title": "Header 4", "format": "h4"},
 {"title": "Header 5", "format": "h5"},
 {"title": "Header 6", "format": "h6"},
 {"title": "Pre", "format": "pre"}
]