Настраиваем TinyMCE в MODX Revolution

Одно из самых популярных дополнений для MODX Revolution - визуальный редактор TinyMCE.

Оно и понятно, редко какой сайт может обойтись без хорошего richtext редактора для контента.

В этой статье рассматривается установка и настройка редактора TinyMCE.

Установка

Для установки необходимо скачать пакет из репозитория (http://modx.com/extras/package/TinyMCE) и установить его через раздел "Управление пакетами" вашего сайта.

После установки пакета вы сразу же можете открыть любой ресурс для редактирования и убедиться в том, что редактор появился.

TinyMCE в MODX Revolution

Вы можете сразу же начать писать в нем текст, однако для более комфортного использования рекомендуем произвести настройку редактора.

Настройка TinyMCE

Настройка TinyMCE будет включать несколько этапов:

  • Подключение файла стилей
  • Добавление кнопок для работы с таблицами

Подключаем файл со стилями к TinyMCE

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

Открываем "Настройки системы," и в фильтре выбираем "Визуальный редактор":

Настройки визуального редактора

В этом разделе всего доступно 5 настроек:

  • Путь к CSS файлу (editor_css_path) - указываете путь к вашему файлу со стилями текста. Обратите внимание,что использовать не полный css файл вашего сайта, а отдельный файл, в который вынести только стили, непосредственно относящиеся к оформлению текста (заголовки h1-h6, параграфы p, ссылки a, таблицы tables и другие). Редактор будет работать быстрее и корректнее.
  • Использовать текстовый редактор (use_editor) - можно отключить редактор при необходимости на время, не удаляя при этом TinyMCE.
  • Редактор (which_editor) - MODX Revolution позволяет установить несколько различных редакторов на сайт, при необходимости можно переключаться между ними. Кстати, можно переопределить эту настройку для администраторов сайта, назначив таким образом разным администраторам разный редактор.
  • Редактор для элементов (which_element_editor) - укажите редактор для сниппетов, плагинов, чанков. Например это может быть CodeMirror или Ace.

Добавляем в TinyMCE кнопки для работы с таблицами

В TinyMCE, который устанавливается из репозитория MODX Revolution, по какой то причине по умолчанию отключена работа с таблицами. Нет, вы конечно можете переключится в режим HTML и написать код вручную, но зачем! Гораздо проще потратить 2 минуты и включить поддержку таблиц.

Итак, открываем настройки системы, и в первом фильтре выбираем tinymce:

Настройка TinyMCE

Откроется список доступных параметров. Нас интересуют 2:

  • tiny.custom_plugins - список подключенных плагинов к TinyMCS. В конец списка необходимо добавить "table", подключив тем самым плагин для работы с таблицами. Плагин идет вместе с TinyMCE, и устанавливаеть его не надо, его надо просто включить.
  • tiny.custom_buttons3 - список кнопок, отображаемых на 3-й строке. Укажите там "tablecontrols", добавив тем самым набор кнопок для работы с таблицами. Понятное дело, что эти кнопки можно разместить на любой другой строке. Если вы посмотрите на другие строки, вы увидите список предустановленных кнопок, таких как undo,redo,selectall и много других. Можно "поиграть" ими, размещая кнопки в разном порядке.