Редактори часто просять можливість перетягувати блоки без участі розробника. Налаштування Drupal Layout Builder — це штатний інструмент візуального конструктора макетів, вбудований у Drupal починаючи з версії 8.7. Ми налаштовували його для 40+ проєктів і знаємо, як витиснути максимум без болю. На одному з проєктів з 500 сторінками унікальні макети збільшили час відповіді на 40% — довелося перепроєктувати підхід. Вартість подібного функціоналу при замовленні розробки від $1500, але Layout Builder вже в ядрі Drupal — без додаткових витрат.
Як Layout Builder вирішує проблеми редакторів
Типова ситуація: маркетологу потрібно швидко змінити структуру лендінгу — додати карусель, винести форму захвату. Без Layout Builder доводиться писати новий тип контенту або лізти в twig. З ним — drag-and-drop прямо на сторінці. Два режими: загальний шаблон для всіх матеріалів типу та персональні макети для кожного запису. Другий режим — потужність, але й джерело проблем: кожна унікальна сторінка генерує додаткові запити до БД. Економія часу редактора на правках — до 70%.
Покрокове налаштування Drupal Layout Builder
- Встановіть модулі через Drush:
drush en layout_builder layout_discovery -y drush cr - Перейдіть в адмінці: Структура → Типи контенту → виберіть тип → Управління відображенням. Натисніть «Enable Layout Builder».
- Виберіть режим: Defaults (один макет для всіх нод) або «Allow each content item to have its layout customized» (унікальний макет для кожної ноди).
- Налаштуйте макет за замовчуванням: додайте секції, блоки, поля.
- Обмежте доступні блоки за допомогою модуля Layout Builder Restrictions (див. нижче).
Налаштування для типу контенту
Після ввімкнення Layout Builder відкрийте вкладку «Manage layout». Ви побачите порожню сітку. Додайте секцію (наприклад, one column) і помістіть у неї блоки — поля ноди, кастомні блоки, в'юхи. Для типів контенту з сотнями нод використовуйте лише режим Defaults — персональні макети сильно навантажують БД. Наприклад, на проєкті з 200 нод ми зменшили кількість запитів до БД на 60% завдяки кешуванню.
Як створити кастомну секцію?
Секції реєструються через плагін layout. Приклад: Hero з сайдбаром.
// custom_layouts/layouts/my_hero/my_hero.php namespace Drupal\custom_layouts\Plugin\Layout; use Drupal\Core\Layout\LayoutDefault; /** * @Layout( * id = "my_hero_layout", * label = @Translation("Hero + Sidebar"), * category = @Translation("Custom"), * template = "layouts/my-hero", * regions = { * "hero" = { "label" = @Translation("Hero Area") }, * "sidebar" = { "label" = @Translation("Sidebar") } * } * ) */ class HeroSidebarLayout extends LayoutDefault {} Twig-шаблон layouts/my-hero.html.twig:
<div class="layout-hero-sidebar"> <div class="layout-hero-sidebar__hero"> {{ content.hero }} </div> <aside class="layout-hero-sidebar__sidebar"> {{ content.sidebar }} </aside> </div> Після створення очистіть кеш — секція з'явиться у списку при редагуванні.
Обмеження блоків з Layout Builder Restrictions
Без цього модуля редактор може вставити в колонку блок, який ламає верстку. Модуль Layout Builder Restrictions дозволяє на рівні типу контенту вказати, які блоки доступні в кожній секції. Встановлюємо:
composer require drupal/layout_builder_restrictions drush en layout_builder_restrictions -y Налаштування: Структура → [тип контенту] → Управління відображенням → Layout Builder → Restrictions. Там задається whitelist блоків для кожної секції.
Чому Layout Builder може гальмувати?
Основні причини:
- Blob-дані унікальних макетів — кожного разу парсяться.
- Відсутність кешу для макетів — повторні запити до БД.
- Велика кількість блоків на сторінці (більше 20).
| Причина | Рішення |
|---|---|
| Blob-дані при кожному рендерингу | Використовуйте Dynamic Page Cache та BigPipe для кешування частин сторінки. |
| Відсутність кешу макетів | Увімкніть BigPipe та налаштуйте кешування через hook_layout_builder_defaults_alter(). |
| Багато блоків на сторінці | Скоротіть кількість блоків, використовуйте Layout Builder Restrictions. |
Порада з кешуванням для продуктивності
Для типів контенту з більш ніж 50 нодами відмовтеся від персональних макетів. У Drupal Performance Documentation підкреслюється важливість кешування для Layout Builder.Порівняння: Layout Builder у 2-3 рази зручніший для редактора, ніж Paragraphs
| Параметр | Layout Builder | Paragraphs |
|---|---|---|
| Інтерфейс | Drag-and-drop | Форма додавання |
| Структура даних | Blob | Чисті сутності |
| Підтримка API | Погана | Відмінна |
| Продуктивність | Важкий | Легкий |
| Кастомізація | Секції | Вкладені параграфи |
Layout Builder зручніший для маркетологів — візуальний drag-and-drop. Paragraphs зручніший для розробників — чиста структура даних, передбачуваний вивід у templates, хороша підтримка API. Вибір залежить від задачі: якщо потрібна максимальна гнучкість для редактора без коду — Layout Builder; якщо проєкт складний або headless — Paragraphs.
Що входить у налаштування Drupal Layout Builder під ключ
| Етап | Опис |
|---|---|
| Ввімкнення та конфігурація | Налаштування для 2-3 типів контенту |
| Створення кастомних секцій | 3-5 секцій з унікальними регіонами |
| Обмеження блоків | Налаштування Layout Builder Restrictions для кожної секції |
| Інтеграція | Підключення існуючих блоків та в'юх |
| Перевірка продуктивності | Аудит кешування, рекомендації |
| Документація | Інструкція для редакторів зі скріншотами |
Строки
Налаштування Drupal Layout Builder для 2–3 типів контенту з кастомними секціями — від 3 до 5 робочих днів. Строк може варіюватися залежно від складності макетів та необхідності інтеграції з іншими модулями.
Типові помилки та як їх уникнути
- Не включати Restrictions — редактор ламає верстку непідходящими блоками. Рішення: завжди налаштовувати Restrictions.
- Давати персональні макети всім нодам — вбиває продуктивність. Рішення: давати персональні макети лише типам контенту з малою кількістю нод (до 50).
- Ігнорувати кешування — Layout Builder генерує багато запитів. Рішення: увімкнути BigPipe та Dynamic Page Cache.
Якщо потрібна допомога з налаштуванням Drupal Layout Builder або хочете уникнути типових помилок — зв'яжіться з нами. Гарантія якості налаштувань підтверджена сертифікованим Drupal-розробником у команді. Наші інженери мають більше 5 років досвіду роботи з Drupal і налаштували Layout Builder для 40+ проєктів. Отримайте безкоштовну консультацію з кешування та кастомних секцій.