УЧЕБНЫЕ МАТЕРИАЛЫ

Web-верстка, компьютерная графика,
мультимедиа

Справочные материалы по MODx Revolution




Визуальный редактор CKEditor для MODx Revolution

Документация https://ckeditor.com/cke4/addon/codemirror

Как включить подсветку синтаксиса в CKEditor

1. Скачайте последнюю версию codemirror https://github.com/w8tcha/CKEditor-CodeMirror-Plugin/releases

2. Распакуйте скачанный архив в папку плагинов по адресу: ваш_сайт.ru/manager/assets/components/ckeditor/ckeditor/plugins/

3. Замет в правом верхнем углу административной части сайта нажмите значок шестеренки, далее  Системные настройки. В поле core выберите ckeditor

4. В поле Дополнительные плагины установите значение codemirror.

В файле конфигурации CKEditor по адресу ваш_сайт.ru/manager/assets/components/ckeditor/ckeditor/config.js добавьте строку config.extraPlugins = 'codemirror';


Чтобы изменить внешний вид редактора, скачиваем «шкурку» (Skin) по адресу https://ckeditor.com/cke4/addons/skins-0

Архив распаковать в папку manager/assets/components/ckeditor/ckeditor/skins

Выбираем в правом верхнем углу значок шестеренки — Системные настройки. В поле core выбираем ckeditor

В поле Шкурка редактора (ckeditor.ckin) написать имя папки скина. Например, при подключении скина Moono Color это выглядит вот так.

В поле Группа кнопок можно вставить вот такую конструкцию:

[{"name":"document","groups":["mode","document","doctools"]},{"name":"clipboard","groups":["clipboard","undo"]},{"name":"editing","groups":["find","selection","spellchecker"]},{"name":"links"},{"name":"insert"},{"name":"forms"},"/",{"name":"basicstyles","groups":["basicstyles","cleanup"]},{"name":"paragraph","groups":["list","indent","blocks","align","bidi"]},{"name":"styles"},{"name":"colors", , items : [ 'TextColor','BGColor' ]},{"name":"tools"},{"name":"others"},{"name":"about"}],
{"name": "styles", "groups": ["Styles", "Format", "Font", "FontSize", "Forecolor"]}

Внешний вид редактора стал вот таким: