Skip to content
PageBuilder
Визуальный конструктор секций для MODX 3: черновик и публикация без перезаписи content ресурса
  1. Компоненты
  2. PageBuilder
  3. Начало работы

Быстрый старт

1. Установите зависимости и пакет

ТребованиеВерсия
MODX Revolution3.0.3+
PHP8.2+
VueTools1.1.2+
pdoTools3.0+
PageBuilder (Free)1.0.1-beta
PageBuilder Pro1.0.1-beta, требует pagebuilder ≥ 1.0.1

Пакеты PageBuilder (Free) и PageBuilder Pro ставятся из modstore.pro. Без провайдера установка падает с Package provider not found.

  1. Подключите ModStore.
  2. Установите VueTools и pdoTools, если их ещё нет на сайте.
  3. Extras → Installer → Download Extras — найдите PageBuilder (Free) или PageBuilder ProDownloadInstall.
  4. Настройки → Очистить кэш. В списке пакетов должен появиться namespace pagebuilder.

Pro

Достаточно установить PageBuilder Pro: ядро Free (pagebuilder) MODX подтянет сам. Отдельно Free ставить не нужно.

Пакеты в каталоге: modstore.pro.

2. Выдайте права

В Пользователи → Группы пользователей добавьте политике редактора:

  • pagebuilder_view
  • pagebuilder_save

Для управления типами секций в панели управления: pagebuilder_manage_types.

3. Включите вкладку «Секции»

По умолчанию вкладка выключена. В Системные настройки → namespace pagebuilder:

КлючЗначение
pagebuilder_resource_tab_enabled1
pagebuilder_resource_tab_parentsпусто = все ресурсы, или ID родителей через запятую

Позицию вкладки задаёт pagebuilder_resource_tab_index (0 первая, -1 последняя).

Вкладка «Секции» на ресурсе

Подробнее: Системные настройки.

4. Подключите вывод в шаблон

В шаблон страницы или в поле content ресурса:

modx
[[!PageBuilder]]
fenom
{'!PageBuilder' | snippet}

Сниппет рендерит опубликованные секции текущего ресурса. Черновик на сайте не показывается.

5. Соберите страницу в менеджере

  1. Откройте ресурс → вкладка Секции.
  2. Добавьте секцию (например Hero), заполните поля.
  3. Нажмите Сохранить (черновик).
  4. Нажмите Опубликовать. Та же раскладка появится на сайте.

При pagebuilder_fake_enabled = 1 в инспекторе появляется кнопка Fake: заполняет поля демо-данными для быстрой проверки вёрстки.

Превью черновика без публикации: кнопка Preview во вкладке (токен через preview.php).

6. Проверка на фронте

Откройте ресурс на сайте. Должен появиться HTML секций. По умолчанию подключается pagebuilder-sections.css (настройка pagebuilder_load_frontend_css).

Если блок пустой:

  • секции не опубликованы
  • у сниппета нет прав на ресурс
  • в шаблоне закэширован вызов без !. Используйте [[!PageBuilder]]

Дальше