Fred для действующих разработчиков MODX

Fred это визуальный drag-and-drop редактор контента. Он снижает или убирает необходимость для авторов и редакторов ежедневно работать в MODX Manager. Пользователи создают контент, не изучая Manager, и видят результат так же, как на опубликованной странице. Многим такой визуальный drag-and-drop интерфейс кажется понятнее и проще в освоении.

На одном сайте могут сосуществовать страницы под Fred и страницы, которые правят только через Manager. Страницы под Fred нужно редактировать в UI Fred.

Когда вы вошли на сайт как редактор Fred, на странице появляются круглые иконки с доступом к элементам управления Fred:

При наведении на части страницы с Fred секции подсвечиваются синей рамкой. Это границы Elements, из которых собрана страница. Имя Element показывается внизу слева при наведении. Элементы позиционирования и настроек находятся внизу справа:

Вы часто работаете с Sidebar. Её открывают по главной иконке MODX. В зависимости от настроек Fred, которые задали владельцы сайта или разработчики, основные элементы управления Fred могут быть в любом из углов страницы.

Меню «Site» похоже на дерево Manager, но показывает только страницы с Fred.

Меню «Blueprints» даёт создавать и использовать Blueprints.

Меню «Elements» даёт доступ к Elements для сборки или дополнения страницы.

Меню «Settings» настраивает параметры страницы, аналогично Manager: отложенная публикация, пункты меню, расширенные настройки, псевдоним URL, pagetitle/longtitle и т.д.

Меню «More…» открывает страницу в Manager, ссылку на документацию, опцию отключить Fred и выход, чтобы смотреть сайт как обычный посетитель.

Иконка «Preview» (глаз) показывает страницу под верхней панелью с симулятором адаптивного просмотра: телефон, планшет и полный desktop.

Иконка «Close» (x) закрывает sidebar и возвращает начальное состояние Fred с четырьмя кругами.

Иконка «Save» (галочка) сохраняет страницу.

Elements¶

Elements это базовый строительный блок Fred. Element может быть простым заголовком или сложным блоком вроде карточки товара в интернет-магазине.

Когда вы вошли как редактор Fred, при наведении на части страницы секции подсвечиваются синей рамкой, границей самого Element. Elements настраивают через Option Sets. Доступ к ним по иконке шестерёнки, затем «Open Settings & Plugins» внизу справа при наведении на Element.

Elements можно дублировать и использовать на странице Fred несколько раз.

Элементы управления Element¶

При наведении на Element внизу появляются элементы позиционирования, а внизу справа иконка шестерёнки с настройками Element.

Меню Option Set строится из JSON-массива, который управляют через Fred Third-party Component.

Триггер меню настроек¶

Option Sets, привязанные к Element, открываются по иконке шестерёнки над элементами позиционирования.

Меню настроек¶

Меню настроек позволяет пользователям с нужными правами выполнять несколько действий с Element:

• Сделать скриншот текущего состояния Element для создания тем
• Создать частичный Blueprint из текущего состояния Element
• Открыть панель настроек Element
• Дублировать Element сразу после текущего
• Удалить Element со страницы

Элементы позиционирования¶

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

Fred и классические шаблоны MODX¶

Fred отличается от классических шаблонов MODX тем, что для сложных макетов почти не нужны Template Variables (TV).

Это упрощает работу и может ускорить сайт без потери гибкости, которую TV давали MODX.

В Fred TV часто заменяют Option Sets. Во многих случаях они работают как замена TV без лишней сложности и нагрузки на базу. Сейчас Option Sets хранят только текстовые значения, поэтому их лучше использовать для text, textarea, richtext, чисел и т.п.

Где TV всё ещё уместны в Fred¶

TV остаются нужны на страницах с MIGX или TV маркеров Google Map.

TV также помогают разделить контент на индексируемый и неиндексируемый. Например, блок в TV [[*sidebar]] можно исключить из поиска, а поле [[*content]] оставить в индексе.

Чем заменяют TV¶

В Fred Option Sets закрывают многие сценарии, где раньше в Manager нужны были TV.

Настройки options это элементы управления при клике по шестерёнке у каждого Element на странице. Через ту же шестерёнку авторы контента получают доступ к типичным настройкам страницы MODX: отложенная публикация, показ или скрытие в меню и т.д.

Option Set может содержать несколько полей, для которых раньше заводили отдельные TV: переключатели макета, text или richtext, слайдеры чисел, выбор цвета, Font Awesome icon chooser, загрузку изображений и др.