MODX — Шаблоны
Шаблон — это элемент MODX, представляющий собой заготовку, на основании которой может осуществляться вывод любого количества ресурсов. Для того чтобы шаблон использовался для вывода некоторого ресурса, он (шаблон) должен быть связан с ним (ресурсом).
Подключение шаблона к ресурсу осуществляется через поле «Шаблон».
После этого подключенный (выбранный) шаблон будет использоваться для вывода этого ресурса.
Понять назначение шаблона и то, как он связан с ресурсами очень просто, если представить шаблон домом, а ресурс человеком, живущим в этом доме. Дом, так же как и шаблон (страница) состоит из множества деталей (крыша — шапка страницы, стены – каркас страницы, основная часть фасада – основное содержимое страницы, подвал – нижняя часть страницы и т.д.).
Человек (ресурс) может иметь несколько домов (шаблонов), но жить в определённый момент способен только в одном из них. Через некоторое время, человек может переселиться жить в другой дом, это будет аналогичному тому, что ресурсу назначить другой шаблон.
Внимание: Каждый ресурс (страница) в MODX Revolution может использовать в качестве своего вывода только один шаблон. Т.е. MODX не разрешает для вывода ресурса одновременно использовать несколько шаблонов. Но в любое время ресурсу можно назначить другой шаблон. Для этого необходимо на странице редактирования ресурса выбрать нужное значение из раскрывающего списка «Шаблон» и нажать на кнопку «Сохранить». После этого вывод ресурса уже будет осуществляться на основании указанного (другого) шаблона.
Где находятся шаблоны в админке
В админке (менеджере) шаблоны находятся на левой панели во вкладке «Элементы».
Шаблоны состоят из полей: имя, описание, иконка, код шаблона (html) и др.
Основные поля шаблона — это имя и код шаблона (HTML). Имя — это название шаблона. Код шаблона — это его содержимое, на основании которого и будет осуществляться вывод ресурса. Код шаблона в большинстве случаев представляет собой обычную HTML-страницу с наличием в ней специальных тегов MODX (полей ресурса, TV-переменных, чанков, плейсхолдеров, ссылок, системных переменных, вызовов сниппетов). Эти специальные теги и выполняют всю магию. Они выводят данные (значения любых полей) текущего ресурса, формируют динамическое меню страницы, а также любой другой контент, который может быть связан или нет с этим (текущим) ресурсом.
Создание шаблона
Создание шаблона в админке осуществляется посредством выполнения следующих шагов:
- Открыть в левой панели админки вкладку «Элементы».
- Нажать на значок «+» напротив заголовка «Шаблоны».
- В поле имя ввести название шаблона (например, Шаблон1).
- В поле код шаблона (HTML) ввести необходимое содержимое.
Например: Обратите внимание на специальные теги: [[*pagetitle]], [[*description]], [[*longtitle]] и др. Они обрабатываются парсером только тогда, когда браузер пользователя запросит у MODX ресурс, имеющий этот шаблон. Когда это случиться все специальные теги ([[*полеРесурса]]) будут заменены на значения соответствующих полей текущего (запрашиваемого) ресурса. - Сохранить шаблон посредством нажатия на соответствующую кнопку.
Внимание: После создания шаблон автоматически не назначается ресурсам. Указание шаблона определённым ресурсам производится через их редактирование. Т.е. необходимо будет произвести изменения в каждом ресурсе, а именно открыть ресурс, выбрать из раскрывающего списка созданный шаблон и нажать на кнопку «Сохранить».
Редактирование шаблона
Редактирование шаблона в админке осуществляется следующим образом:
- Открыть в левой панели админки вкладку «Элементы».
- Раскрыть содержимое раздела «Шаблоны», нажав на значок треугольника.
- Нажать левой кнопкой мыши на название необходимого шаблона.
- Внести изменения в необходимые поля шаблона.
- Нажать на кнопку «Сохранить».
Где хранятся шаблоны
Шаблоны MODX по умолчанию хранятся в таблице базы данных modx_site_templates (modx — это префикс для таблиц, назначаемый во время установки системы).
Начиная с версии MODX 2.2.x появилась также возможность хранить код шаблона в файле.
Чтобы это сделать необходимо на странице создания/редактирования шаблона выполнить следующее:
- Установить галочку в поле «Статичный».
- Выбрать из раскрывающего списка «Источник файлов для статичного файла» базовый каталог. Базовый каталог — это каталог относительно которого будет указываться расположение статичного файла.
- Указать в поле «Статичный файл» расположение файла относительного базового каталога.
- Нажать на кнопку «Сохранить».
После этого содержимое указанного файла будет использоваться в качестве кода шаблона.
Это возможность предназначено для того, чтобы код шаблона можно было изменять путём редактирования файла.
Использование полей ресурса в шаблоне
Получение значений полей ресурса в шаблоне осуществляется посредством следующего синтаксиса:
Список доступных полей ресурса можно посмотреть здесь. Например, вывести значение поля pagetitle текущего ресурса в тег title:
Например, вывести содержимое текущего ресурса:
Теги, предназначенные для вывода значений полей ресурса, могут также как и другие теги MODX, иметь фильтры вывода. Например, выведем значение поля «introtext» в блок div с классом intro, используя 2 фильтра. Первый фильтр вывода будем использовать для исключения из содержимого поля introtext любых HTML-тегов. Второй фильтр будем использовать для того чтобы вводить на экран не всё содержимое этого поля, а только первые 200 символов. Если данное поле будет иметь большее количество символов, то в конце строчки отобразить знак многоточия (. ).
TV-переменные в шаблонах
Если шаблон сравнивать с домом, то TV-переменные (переменные шаблона) можно представить как комнаты этого дома. Добавление TV-параметра — это получается как добавление новой комнаты в дом.
TV-переменные — это дополнительные поля, которые может иметь ресурс. Привязываются TV-поля к ресурсу через шаблон. MODX позволяет добавить к ресурсам бесконечное число дополнительных полей (TV-переменных) посредством шаблона.
Например, необходимо добавить ко всем ресурсам, имеющим шаблон «city», дополнительное поле photo. Чтобы это осуществить необходимо выполнить следующие действия:
- Необходимо создать TV-переменную photo.
- Установить этой переменной на соответствующих вкладках в качестве типа ввода и вывода необходимое значение. Например, изображение.
- На вкладке «Доступно для шаблонов» установить галочку напротив шаблона «city».
После этого у ресурсов, имеющих шаблон «city» появится дополнительное поле.
Для того чтобы вывести значение поля (TV-параметра) city в шаблоне необходимо использовать следующую конструкцию:
TV-переменные должны быть явно назначены шаблону. Только после этого они станут доступными при редактировании соответствующих ресурсов. Если в режиме редактирования ресурса, необходимые TV-параметры не отображаются, значит, они не были назначены шаблону, который этот ресурс использует.
Как установить шаблон в MODX
Современные CMS позволяют задавать оформление сайтов из готовых шаблонов, что сильно упрощает жизнь людям, которые не сильно подкованы в веб-программировании и дизайне. Не является исключением и MODX.
Шаблон представляет собой несколько файлов и папок, которые необходимо положить в специальный каталог на сайте.
Пример шаблона для MODX.
Для установки дизайна из готового шаблона создайте в каталоге assets/templates/ новую папку, куда и нужно будет положить файлы и папки, о которых говорилось выше. Путь к шаблону может быть и иным.
Далее необходимо зайти в административную панель MODX, перейти в раздел Элементы и нажать на кнопку добавления нового шаблона (на скриншоте). Представленные далее скриншоты относятся к MODX Revolution, однако принципы работы с шаблонами аналогичны и для MODX Evolution.
Создание нового шаблона в MODX.
Откроется форма, которую нужно заполнить при создании шаблона.
Обязательно надо задать имя шаблона и вставить код из файла index.html. После этого нужно сохранить шаблон.
Для применения шаблона нужно открыть свойства документа в разделе Ресурсы.
Там можно выбрать необходимый шаблон из выпадающего списка.
Не забудьте сохранить изменения.
Однако, если мы посмотрим на результат своей работы, мы увидим, что шаблон отображается не совсем корректно.
Причина кроется в том, что не подключились таблицы стилей (CSS). Поэтому нам потребуется отредактировать код шаблона.
Снова открываем шаблон и прописываем между тегами <head> и </head> базовый путь для шаблона:
В MODX Evolution вместо [[++site_url]] используйте [(site_url)] .
Вторым шагом будет редактирование путей ко всем файлам стилей, изображений и скриптов, что вы найдёте в коде шаблона. Проще всего искать строки кода, содержащие src .
Так, если в коде у вас прописан путь к изображению
то нужно добавить путь к каталогу шаблона (в моем случае /assets/templates/pure/, но каталог с шаблоном может называться и иначе). В результате получится
Сохраните шаблон после редактирования, и дизайн сайта примет вид, задуманный разработчиками шаблона.
Создание сайта на Modx Revolution. Урок 4. Натягивание html шаблона. Создание чанков
Всем привет. В прошлом уроке мы научились устанавливать систему управления сайтом Modx Revolution. В этом уроке мы найчимся внедрять или устанавливать шаблон в эту систему. Также я приведу список необходимых дополнений, которые нам понадобятся для создания сайта на Modx Revolution.
Для начала установим нужные дополнения. Если вы забыли как устанавливать пакеты из репозитория, напомню. Заходим в Пакеты/Установщик
Нажимаем «Загрузить пакет»
И вбиваем в поиск нужный нам пакет
Вот список дополнений, которые, на мой взгляд, необходимы для работы с шаблоном и нормального функционирования простого многостраничного сайта:
Ace — редактор HTML/CSS/PHP/JavaScript кода для удобной работы над чанками, сниппетами, плагинами и шаблонами страниц (что это такое мы узнаем ниже).
AjaxManager — плагин для быстрой работы админки на технологии ajax (без перезагрузки страницы)
Все эти дополнения вам нужно установить из официального репозитория, инструкцию как пользоваться к которому я привел выше. И два дополнения нужно установить из репозитория modstore.pro. Но для начала нужно создать нового поставщика пакетов.
Как подключиться к репозиторию modstore.pro
Вводим email, пароль, имя. Жмём «Регистриция». На почту придёт письмо с ссылкой для подтверждения регистрации и паролем. Переходим по ссылке, входим в аккаунт.
3. Кликаем по своему имени и заходим в раздел «Ключи для сайтов»
кликаем «Создать ключ»
откроется такое окно
если требуется, пишем описание ключа, например «для тестового сайта». Нажимаем «Сохранить». Ключ создан.
Копируем сам ключ и идём в админку Modx Revolution
4. Заходим в Пакеты/Установщик и кликаем на «Поставщики»
Жмём «Добавить нового поставщика»
Название — modstore.pro
Url поставищка — https://modstore.pro/extras/
Имя пользователя — ваша электронная почта, при помощи которой вы авторизуетесь на этом сайте.
Ключ API — ваш сгенерированный ключ доступа, который вы только что скопировали.
Описание — необязательное поле.
Жмем «Сохранить». Если вы всё правильно заполнили, то появится новый поставщик
Теперь мы можем установить еще два дополнения, которые в любом случае нам понадобятся. Этот репозиторий нам понадобится еще ни раз. Заходим в Пакеты/Установщик, кликаем на иконку открытия кнопки «Загрузить пакеты»
Выбираем «Выберите поставщика»
Выбираем поставщика modstore.pro
и теперь в том же окне поиска ищем и устанавливаем следующие дополнения:
TinyMCE Rich Text Editor — это текстовый редактор, с помощью которого мы будем форматировать текст на страницах
AdminPanel — панель внизу сайта, которая видна только администратору сайта для редактирования текущей страницы
Итого в нашем менеджере пакетов должно быть 5 дополнений
Внедрение HTML шаблона в Modx Revolution
1. Перенос всех файлов сайта на хостинг
Заходим в наш FTP-клиент (в моём случае это Coda2) и подключаемся к нашему сайту
нам нужно перекачать папки css, fonts, img и js из папки assets из папки сайта на компьютере в папку assets на сервере. Я это делаю просто зажатием и перетаскиванием всех папок в другое окно.
Дожидаемся успешного переноса.
2. Создание шаблона «Главная страница»
Идём в «Элементы»/ Начальный шаблон. Переименовываем его в «Главная страница». Копируем содержимое файла index.html и заменяем содержимое в «Код шаблона (HTML)»
То, что у нас подсвечивается код — это заслуга пакета Ace, который мы установили ранее. Сохраняем шаблон. Я вам предлагаю посмотреть результат. Кликните на Содержимое/Перейти на сайт
И о Боги. Вот он наш сайт
Кстати, если вы кликните по «Редактировать текущую страницу», то попадёте в админку на редактирование главной страницы. Это в работе дополнение «AdminPanel».
Мы уже видим резуальтат на лицо. Правда, на этом работа над сайтом только начинается. Самое время познакомиться со следующими понятиями.
Что же такое чанки, шаблоны, ресурсы, tv-параметры, сниппеты и плагины
Чанки — это блоки кода, которые используются в разных шаблонах. Они нужны для того, чтобы не писать каждый раз один и тот же код в каждом шаблоне
Например, у нас будет блок head, отвечающий за подключение стилей, скриптов и прочего, который будет присутствовать на каждой странице, на каждом шаблоне
Шаблоны — это целые HTML страницы, которые присваиваются к определенным ресурсам. Они нужны для того, чтобы не копировать один и тот же код целой HTML страницы для множества ресурсов.
Например, у нас будут несколько страниц Услуг, у которых будет один и тот же Шаблон «Услуги»
Ресурсы — это страницы нашего сайта: Главная страница, О компании, Главная услуг, множество страниц Услуг, Контакты и так далее
TV-параметры — это поля, в которые мы будем загружать определенную информацию: изображения, заголовки, текст и прочее.
Например, у нас будет tv-параметр img, который будет отвечать за загрузку изображений на страницу.
Сниппеты и плагины — это php код, с помощью которого мы будем делать навигацию, форму обратной связи, выводить статьи в ленте новостей и прочее.
В теории может быть не всё понятно, предлагаю перейти к практике.
Создание чанков
HTML код в шаблоне «Главная страница» очень объемный, его необходимо разбить на чанки. Тем более, что такие блоки, как «шапка сайта» (header) и «подвал» (footer) нам понадобятся и на других страницах.
Начнём с чанка подключения стилей и скриптов. Перейдите в Элементы и нажмите на плюсик возле слова «Чанки»
Чанк head
Назовём чанк head и скопируем в Код чанка следующий код:
Это модифицированный код из нашего HTML шаблона, куда я добавил:
Теперь идём обратно в Шаблон Главной страницы и вместо
Это и есть вызов чанка в шаблоне. Тоже самое проделываем с другими блоками (чанками), которые будут присутствовать и в других шаблонах
Чанк menu_mobile
и копируем этот код в новосозданный чанк menu_mobile. А за место него вставлем конструкцию
Чанк header
И вставляем его в новосозданный чанк header. А вместо него на главной пишем
Чанк scripts
Идём вниз Шаблона Главная страница, находим
Вырезаем, пишем вместо этого
Сохраняем, создаём новый чанк scripts и вставляем туда этот код.
Чанк footer
Чанк newsletter
Чанк main_content
А в чанк main_content «складываем» всё остальное (код не буду приводить, слишком большой, думаю, и так понятно)
В итоге у нас должен получиться вот такой Шаблон «Главная страница»
Согласитесь, с таким кодом уже удобнее и приятнее работать. И если мы захотим изменить что-то, например в мобильном меню, то нам надо будет зайти в чанк menu_mobile и все изменения сохранятся на всех остальных шаблонах, которые мы создадим в следующем уроке.
Как работать с Шаблонами в ModX Revolution
Добро пожаловать на 4 урок MODX Revolution для новичков. На последнем занятии мы сделали некоторые настройки конфигурации сайта и посмотрели как выставлять некоторые глобальные установки. Также мы исследовали как устанавливать дополнения из репозитория MODX с помощью менеджера пакетов. В этой записи мы рассмотрим как работать с шаблонами в MODX Revolution. Мы собираемся начать со статичного HTML/CSS шаблона и через несколько уроков переделаем его в полноценный MODX Revolution шаблон.
Что такое MODX шаблоны?
MODX шаблоны это простые HTML/CSS шаблоны с тегами MODX внутри для динамичной функциональности. Это очень упрощенное определение, но в моей голове сложилось именно такое определения для MODX шаблона. Если вы знаете как программировать HTML/CSS или можете разобраться в таком коде, то остальное для вас не будет проблемой. Вот что делает MODX очень удобным для дизайнера.
Для этого урока я решил использовать тему студии Themeforest для своего сайта. Если вы хотите следовать точно моим шагам, то можете взять этот же шаблон или же взять другой шаблон, вашу собственную разработку либо скачанный с другого ресурса (в Google поищите ‘бесплатные css шаблоны’). Порядок действий для разработки шаблона будет аналогичным.
В этом уроке я буду использовать 7 in 1 Business Success Site шаблон потому что он имеет отличный вид и в то же время достаточно сложный, чтобы его было интересно портировать в сайт MODX . В комплекте 7 различных цветовых стиля, я буду использовать синий, а вы выбирайте какой вам нравится. Ну что ж начнем!
Первое, что я хочу отметить: способ построения шаблона показанный в этом уроке — это не единственный или единственноверный способ, это просто один из способов, которые я использую. MODX не ограничивает ни в том куда положить файлы или как разбивать шаблон… Как вам удобно, так вы и делайте ваш шаблон или как удобно вашему клиенту. Поэтому держите это в уме и можете отступать в порядке построения и изобретать свои более оптимальные способы, как говорится — делай как я, делай лучше меня.
1. Загрузка файлов шаблона
Любой шаблон содержит в себе много файлов – css файлов, яваскрипт, рисунков, флеш файлов… Все это нужно где-то хранить на вашем сервере, чтобы ваш шаблон имел к этим файлам доступ. Я предпочитаю хранить все файлы, которые относятся к шаблону в середине директории assets. Вы можете положить куда угодно и установить соответствующие пути в вашем шаблоне.
Распакованные файлы шаблона имеют приблизительно вот такую файловую структуру:
Таким образом 1 шагом в нашей разработке шаблона является копирование трех папок с файлами шаблона на сервер, это папки sample-data/, scripts/ и styles/. Я создал папку в середине assets и назвал ее templates, а также я создал папку 7in1, в которую поместил вышеназванные папки с файлами шаблона. Если вы запутались, то посмотрите на картинку и все станет понятно:
Теперь эти файлы доступны для любого шаблона, который вы будете делать.
2. Создание шаблона
После загрузки папок с файлами мы можем начать создание нашего MODX шаблона. В админке нажмите на вкладку Elements слева, откроется панель с различными элементами сайта — шаблонами, чанками, переменными шаблона и другими. Нажмем на templates и увидим, что уже есть в наличии один базовый шаблон с названием Base Template. Если вы на него нажмете, то вы можете увидеть код данного шаблона. Видим HTML код с тегами [[++site_name]], [[*pagetitle]].
Эти тэги трансформируют статичный HTML/CSS код в динамичный MODX шаблон и мы собираемся узнать как его сделать и приложить к этому свои руки.
Давайте продолжим и сделаем наш шаблон. Для создания нового MODX Revolution шаблона нажмите правой кнопкой мышки Templates, а далее New Template.
Можете также нажать на иконке New Template:
В следующем окне задайте название для вашего шаблона и описание. Вы можете разместить его в категории для лучшего порядка вашего сайта. Ну и как вы разместите элементы сайта зависит от вас и вашего вкуса. Я обычно создаю категорию для основного шаблона, где я сохраняю все шаблоны и чанки для этого шаблон, далее делаю то же самое для навигации и так далее. Вы можете организовать свой сайт по своему.
Для создания категории, нажмите правой кнопкой мыши на Categories в закладке Elements.
Ну вот можно добавить код в наш новый шаблон. Начнем мы с создания шаблона для главной страницы. Сейчас я могу сказать, что дизайн главной страницы будет отличаться от дизайна внутренних страниц, поэтому я назову этот шаблон каким-то своим именем, например «7in1 Home». Код домашней страницы находится в файле index.html в папке с шаблонами, которую мы загрузили с Themeforest, поэтому открываем этот файл в редакторе (я использую Notepad++) и копируем его содержимое в наш новосозданный шаблон в MODX. Можно (и это на мой взгляд даже более удобнее) отредактировать вначале код вне MODX Revolution и только потом перенести отредактированный код исправленного шаблона, но исходя из целей данного урока, все эти действия проведём внутри редактора MODX.
3. Отредактируйте пути
Поменяем в нашем коде пути к папкам шаблона. Мы скопировали наш шаблон в папку assets/templates/7in1. Поэтому нам нужно изменить пути ссылок к css файлам, js файлам, изображениям и др. на корректные пути на нашем сервере. Этот элемент вашей работы для ускорения можно сделать до того как копировать код шаблона в редактор MODX. Сейчас просто посмотрев на код, я могу сказать, что мне нужно искать папку styles/ и заменить ее на assets/templates/7in1/styles/, и так далее. Заменим все необходимые пути и сохраним наш шаблон. Вы можете обнаружить, что что-то упустили и есть ошибка в выводе страницы, поэтому возвращайтесь и снова откорректируйте пути.
4. Назначение шаблона
Итак мы закончили портирование шаблона, давайте назначим шаблон страницы и посмотрим, что же мы наделали. Для определения шаблона для страницы нам необходимо перейти на вкладку Resource и открыть ресурс для которого мы хотим определить шаблон (в нашем случае это страница Home). Если вы нажмете на поле Uses Template, то в выпадающем списке можно будет выбрать новый только что созданный нами шаблон.
После выбора шаблона нажмите Save появится сообщение о том, действительно ли вы хотите изменить шаблон, подтверждаем. Важность этого прояснится после того, как мы сделаем разные шаблоны, у которых будет множество чанков и переменных шаблона и которые мы по-разному разместим, поэтому вам необходимо быть уверенным в правильности выбора шаблона, ресурс для которого вы редактируете в данный момент.
После сохранение, мы можем просмотреть страницу и увидеть как она теперь выглядит. Вот снимок экрана, на котором видна верхняя часть страницы:
Вот нижняя часть:
Как вы видите, наш сайт приобретает нужный вид, а мы всего лишь изменили пути к файлам. В то же время, контент, тег названия страницы, навигация и остальное — остались статичными, поэтому дальше мы начнем вставлять теги и использовать инструментарий MODX.
5. Синтаксис тегов MODX Revolution
Для того, чтобы сделать шаблон MODX Revolution динамичным, нам необходимо научится работать с тегами MODX. В движке MODX много различных тегов, которые можно использовать для создания и добавления изменяемых элементов контента на вашем сайте. Полный список доступных тегов MODX Revolution можно найти в руководстве. Если вы использовали до этого MODX Evolution, то вы поймете концепцию тегов, но все же вам необходимо посмотреть в документацию и усвоить новый синтаксис.
Если вы до этого никогда не использовали MODX, то не волнуйтесь, мы изучим как использовать эти теги в процессе построения сайта. Для начала посмотрите на таблицу сверху, на ней представлены синаксис тегов для разных версий MODX.
В данном уроке мы в основном будем использовать теги системных установок.
6. Изменения заголовка сайта в MODX Revolution
Первое, что мы сделаем — это изменим тег заголовка сайта, чтобы он выводил имя нашего сайта, а не имя шаблона, как сейчас:
Чтобы сделать это, нам нужно просто переместится в область кода, отвечающего за вывод заголовка сайта и заменить его системным тегом. Давайте взглянем на элемент <head> нашего шаблона:
Нам нужно просто заменить текст Business Success в заголовке на системный тег, который передаст текущий заголовок сайта с наших системных настроек. Заменим таким образом Business Success на [[++site_name]]. Также сделаем еще одну вещь, тип переменных можно определить в системных настройках нашего сайта, поэтому заменим UTF-8 на [[++modx_charset]]. Таким образом приведенный выше код приобретёт следующий вид:
Сохраните шаблон и посмотрите на изменения: теперь заголовок сайта выводит имя нашего сайта.
Дополнительно, если вы посмотрите на код, вы увидите, что парсер MODX взял установки нашего сайта для типа данных и вставил динамически правильный тип данных.
Это случилось таким же образом как и с нашим шаблоном, но все происходит динамически и тип данных не является статической величиной.
Еще одна важная деталь: к нашему элементу <head> необходимо добавить тег <base>. Данный тег мы используем для определения адреса по умолчанию для всех ссылок на странице. Поэтому в моём случае мы внесем следующие изменения:
Это сработает отлично, но снова вместо тяжело-набираемого адреса, лучше использовать тег системных настроек. Используем этот тег и код будет выглядеть так:
Теперь посмотрим исходный код сгенерированной MODX Revolution страницы и увидим, что парсер вставил правильный адрес сайта:
Ну что ж, на этом мы закончим. Мы сделали значительный прогресс и теперь у нас есть начальные знания в построении шаблона MODX Revolution. Мы увидели пример того как делаются начальные настройки, создали новый шаблон, добавили его в категорию и начали добавлять теги MODX Revolution для начала преобразования нашего статического шаблона в динамический шаблон MODX.