В общих чертах описываю процесс и особенности разработки сайта на Modx.
Первоначальная установка
- Иду на офиц сайт и скачиваю последнюю версию modx (либо 2ой линейки, либо 3ей, какую скачивать определяю в зависимости от задач, некоторые специфические пакеты могут не быть для одной из них), проверяю после распаковки файлов на сервере правильность прав доступа на папки – должны быть 755. Запускаю обычную установку. Если какие-то косяки и ошибки, то проверяю версию PHP, ставлю не ниже 8 и запускаю заново установку.
- Первым делом после установки настраиваю дружественные ссылки. Иду в системные настройки “core->дружественные url” и ставлю галки с разрешениями.
- Настраиваю файл .htaccess в корне сайта, раскомментирую строки отвечающие за редирект с http->https, а также строки отвечающие за дружественные ссылки.
- Устанавливаю необходимый минимальный набор пакетов (смотри ниже).
- Активирую шаблонизатор Fenom (смотри ниже).
Минимальный набор необходимых плагинов (бесплатно)
- Ace – удобный редактор кода
- TinyMCE Rich Text Editor – удобный редактор текста
- pdoTools – это набор удобных сниппетов для повседневной работы + небольшая библиотека, которая делает их очень быстрыми.
- MIGX – пакет позволяет создавать сложные повторяющиеся структуры данных и выводить их на сайт, например слайдеры, таблицы, данные о товаре и т.д.
- Collections – пакет позволяет упорядочить ресурсы по коллекциям и настроить представление ресурсов структурированным образом. (Например коллекция – блог), например можно вывести в списке ресурсов любые TV и сделать фильтрацию по ним.
- ClientConfig – пакет позволяет создавать пользовательские настройки для всего сайта, например для ввода контактов, логотипов, и т.д.
- Sendit (есть только тут) – компонент для работы с формами на сайте. Можно асинхронно отправлять на сервер и обрабатывать и выводить любые данные, также с помощью него отправлять сообщения с сайта на почту. Можно организовать много шаговые формы, регистрацию и авторизацию и тд. При установке Sendit подтянется зависимый пакет Formit, который и отвечает за отправку форм. Однако именно Sendit будет заниматься асинхронной отправкой. Про все возможности расписано в документации тут. А то как я использую Sendit будет статья тут.
- pThumb – управление выводом и регенерацией размеров изображений.
- MixedImage – Добавляет новый тип поля: Смешанная загрузка файла/Mixed Image Input. Ставлю его в каждый сайт потому что облегчает загрузку картинок админу, можно настроить автопереименование, автообрезку, сжатие, автоудаление и много другого.
Вот дополнительные плагины которые я ставлю в зависимости от необходимых дополнительных задач согласно техническому заданию:
- EasyRedirects (есть только тут) – очень удобная штука позволяющая настроить любые редиректы по шаблонам, полезно когда старый сайт имеет ссылочный вес, но нужно переделать структуру без потерь
- Quickstart Buttons – Позволяет создавать удобные виджеты для панели управления. Например создать быстрые кнопки к разным разделам админки сайта. Я обычно сразу делаю кнопку для очистки кеша, кнопку на контакты, кнопку на переводы (если мультиязычный сайт) и кнопку на все запросы с форм сайта.
- HybridAuth – Основная цель выступать в качестве абстрактного api между вашим приложением и различными социальными API и поставщиками идентификационных данных, такими как Facebook, Twitter, MySpace, LinkedIn, Google и Yahoo. Обычно ставлю если на сайте нужна регистрация и вход
- mSearch2 (Платный)- Морфологический поиск и фильтрация данных. Использую если есть много разных типов данных на сайте и фильтрация на основе сложных полей а также на мультиязычных сайтах. Из коробки не работает с MIGX но я покажу как легко это исправить.
Плагины для мультиязычности
Тут есть два варианта:
- БЕСПЛАТНО: Localizator – ставлю для простых сайтов где минимум функционала. Мои наработки по работе с пакетом будут тут
- ПЛАТНО: Polylang – ставлю для сложных сайтов, поскольку есть интеграция с многими плагинами, автоматическое заполнение полей переводом и конечно поддержка
Более подробно про настройку и использование в работе по каждому из упомянутых пакетов распишу позднее.
Шаблонизатора Fenom вместо стандартного
В стандартном шаблонизаторе MODX используется сложный и не удобный синтаксис. Например что понятнее, это
[[+idx:if=`[[+idx]]`:eq=`1`:then=`<p>текст1</p>`:else=`<p>текст2</p>`]]
Code language: JSON / JSON with Comments (json)
или это
{if $idx == 1}
<p>текст1</p>
{else}
<p>текст2</p>
{/if}
Code language: HTML, XML (xml)
Поэтому я сразу иду в системные настройки -> pdotools -> разрешаю Fenom для чанков и страниц. Fenom обладает множеством удобных модификаторов, а также позволяет использовать привычные конструкции типа if-else, foreach и других. При этом код выглядит чисто и читабельно, что повышает скорость и качество разработки.
Кроме того в конструкциях на феном можно использовать php код (если разрешили конечно в настройках) что иногда бывает очень удобно. С fenom можно сократить количество чанков и сниппетов, например легко вывести сложные данные например из MIGX полей через обычный цикл foreach. Подробнее про модификаторы Fenom читать тут, а тут моя подборка-шпаргалка по Fenom
Структура сайта с разбивкой на блоки
Создаю в начале шаблон Base в котором прописываю основную структуру сайта – html, head, header и footer, что сокращает количество повторяющегося кода из шаблона в шаблон, а также количество чанков. Удобно когда основные скрипты, стили и главные менюшки все в одном месте а не раскиданы по чанкам.
Пример базового шаблона в котором настраиваем шапку, подвал и меню
<!DOCTYPE html>
<html lang="ru" >
<head>
<title>{$_modx->resource.pagetitle}</title>
<meta name="description" content="{$_modx->resource.description}">
<link rel="canonical" href="{$_modx->resource.id | url : ['scheme' => 'full']}"/>
<link rel="stylesheet" type="text/css" href="/assets/css/main.css?v=15" />
...
{block 'head'}
{/block}
</head>
<body>
<header>ШАПКА САЙТА</header>
<main class="content">
{block 'content'}
<div class="container">
<h1 class="fw100">{$_modx->resource.pagetitle}</h1>
</div>
<div class="container">
{$_modx->resource.content}
</div>
{/block}
</main>
{block 'benefits'}
{'benefits' | chunk}
{/block}
{block 'contacts'}
{'contacts' | chunk}
{/block}
<footer>Все что в футере<footer>
<script type="text/javascript" src="/assets/js/main.js?ver=15"></script>
</body>
</html>
Code language: HTML, XML (xml)
Пример дополнительного шаблона для страницы расширяющего базовый base
{extends 'template:Base'}
{block 'head'}
этот блок только для этого шаблона
{/block}
{block 'content'}
этот блок только для этого шаблона
{/block}
{block 'contacts'}
этот блок только для этого шаблона
{/block}
Code language: JavaScript (javascript)
Настройка админки под клиента
В modx все завязано на шаблоны, набор полей ресурса может быть расширен или наоборот сокращен в зависимости от привязанного к ресурсу шаблона. Чтобы добавить новые поля обычно мы создаем TV поля и назначаем их шаблону. Затем они появляются по умолчанию в специальной вкладке “Дополнительные поля”. Чтобы изменить это есть разные варианты:
- Используя системную настройку tvs_below_content – тогда все TV поля будут внизу, а не во вкладке. Кстати если полям назначить разные категории то они будут расфасованы по вертикальным вкладкам в соотвествии с категорией
- Используя “Настройку форм” – это пункт меню в админ панели, в котором можно создать профиль и для каждого шаблона указать какие стандартные поля и вкладки должны быть выключены или переименованы, а также изменить расположение и порядок вывода TV полей. Для всех TV полей обычно я меняю области вывода на эти 3: modx-resource-main-left, modx-resource-main-right и modx-resource-content. Для этого во вкладке Дополнительные поля у каждого поля меняем регион и порядковое число.
- третий способ – используя бесплатный пакет ExtraFields в котором можно как создать все необходимые дополнительные поля так и назначить место и условие вывода. Этот плагин отлично кастомизирует и менеджер пользователей. Так я создал для конкретной группы пользователей отдельную вкладку с полями которые заполняются при регистрации.
- Четвертый способ – это создать плагин который будет реагировать на определенное событие – например на сохранение или создание, реагировать на конкретный ресурс или все ресурсы конкретного родителя и кастомизировать как хотим.
- Пятый способ – крутой пакет с ограниченной бесплатной версией PageBlocks
Перенос сайта на хостинг клиента
Перенос сайта на modx очень прост, вот как я обычно это делаю:
- Очищаю папку cache по адресу /core/cache
- Делаю архив всех файлов и экспорт БД, заливаю на новый сервер, проверяю чтобы права на папки были верными после распаковки – обычно 755
- Если ставлю Modx версии 2 то правлю пути к файлу config.inc.php в трех файлах: в корне сайта /config.core.php, в /manager/config.core.php и в /connectors/config.core.php
- Заменяю данные подключения к БД и все пути на новые в /core/config/config.inc.php
- Если сайт не завелся по каким-то причинам то всегда помогает способ накатывания этой же версии modx поверх сайта (опять не забываем проверить не изменились ли права доступа и обязательно распаковку делаем с заменой файлов), затем запускаем в браузере сайт/setup и выбираем галку “обновление уже существующего сайта”, после этого сайт должен заработать на 100%
Почему я перешел с WP на MODX?
- Я могу сделать любую структуру сайта какую захочу и вывести любые данные как хочу и где хочу, Modx убирает границы которые ставят другие CMS, поэтому некоторые называют Modx не CMS а CMF, то есть не просто система управлением контента, а целый фреймворк. Для программиста удобно когда у тебя прямо в админке есть доступ к созданию плагинов к любому событию, что позволяет создать любой функционал в сжатые сроки
- Кастомизация админки сайта – жирный плюс по сравнению с другими движками. Тут я могу создать любые поля и вывести их в админке прямо из коробки так как мне нужно и там где я захочу, таким образом заполнение контента и управление сайтом становится супер легким для заказчика. Тут нет никаких назойливых просьб поставить оценку или лайк за плагин и никакой рекламы в админке.
- Отличное кеширование из коробки без танцев с бубном как например у WP. Сайт будет работать супер быстро.
- Большое и дружное сообщество а также множество дополнительных плагинов которые расширяют и так большой функционал движка из коробки
Если вам нужно создать новый сайт с интуитивно понятной админкой, быстрый и безопасный то я к вашим услугам support@web86.ru