Layout Builder — это один из модулей ядра Drupal, который появился в ветке 8.5 в списке экспериментальных модулей, сейчас в ветке 8.6 он по-прежнему экспериментальный, но уже не альфа, а бета и вполне пригоден к использованию, а движуха в issues даёт понять, что разработчики твёрдо нацелены сделать этот модуль стабильным.

Зачем же нужен этот модуль?

Layout Builder позволяет настраивать отображение любых сущностей с использованием Layout API. То есть берём шаблон (лэйаут) и вставляем в его регионы блоки. Помимо всех стандартных блоков (Block Content, Views и прочее) есть блоки с полями сущности.

Пытливый читатель уже наверняка задался вопросом, зачем это всё, если есть Page Manager, Panels, Display suite и Panelizer? Ответ прост — перечисленные модули были популярны в 7 версии Drupal, а с выходом 8 версии эти модули были портированы наспех, в то время, как в ядре параллельно велась работа по созданию этого функционала с нуля, учитывая особенности архитектуры восьмёрки. Как итог, Page Manager на данный момент практически заброшен своими создателями, которые переключились на разработку Layout Builder. Разработчики Panelizer признают, что Layout Builder полностью заменяет его, и ведут разработку способов миграции с Panelizer на Layout Builder. Кроме того, интерфейс Page Manager и Display Suite выглядит совершенно дубовым для 2019 года.

Раньше я во всех своих проектах использовал Page Manager и Panels и за это время уже надоело, что с выходом каждой минорной версии ядра Page Manager начинает глючить и приходится ставить всё новые патчи. К слову, в моей заготовке composer.json было три патча для пэйдж менеджера, один для панелей и один для ядра, который был необходим для нормальной работы пэйдж менеджера. Использование Layout Builder позволило отказаться от всего этого.

Перейдём к делу: как пользоваться модулем?

Тут всё невероятно просто: нужно включить модуль, а затем включить его функционал на странице управления отображением нужной сущности:

Как видно, у каждого режима отображения появляются две галочки: первая просто включает Layout Builder для данного типа сущности и вместо привычного списка полей появляется кнопка Manage Layout. Вторая галочка — наиболее интересная — позволяет настраивать лэйаут для каждой сущности отдельно! Причём это не значит, что поставив её, скажем для статей, вам придётся постоянно собирать лэйаут каждой статьи. По умолчанию в каждой статье будет использован лэйаут, который вы настроите в Manage Layout, а при редактировании и просмотре статей будет просто ещё одна вкладка «Макет» (в английской версии Layout), где вы при необходимости можете настроить вывод отдельно взятой сущности.

Страница редактирования макета выглядит так:

Разделы (они же Sections) представляют из себя отдельные лэйауты. Тут очень важное преимущество перед Panels — можно последовательно поставить в столбик несколько лэйаутов, в то время, как Panels позволяет использовать одновременно лишь один лэйаут.

Как видно на картинке, один лэйаут добавлен, и можно добавить лэйаут до и после него. Когда лэйаутов много, можно вставлять лэйауты между ними, а также перетаскивать. Также можно перетаскивать блоки из региона в регион и из лэйаута в лэйаут. На картинке выбран двухколоночный лэйаут, поэтому горят две кнопки «Добавить блок» по одной в каждом регионе. Кстати, интересный момент, при вставке блоков с полями сущности можно настраивать форматтер поля как угодно — отображение лэйбла поля и все настройки, например, стиль изображения для картинок. Это позволяет выводить одно поле многократно разными способами.

У некоторых лэйаутов есть настройки (см. на рисунке надпись Configure Section). Всё зависит от того, как сделан сам лэйаут. У самых простых лэйаутов настроек вообще нет. Но я использую модуль Bootstrap Layouts, в котором у каждого лэйаута можно выбрать классы обёртки и классы регионов — там стандартные колоночные классы бустрапа, плюс классы оформления, плюс возможность добавить любые свои атрибуты, что порой очень полезно. Даже если вы не используете Bootstrap, я очень рекомендую вам посмотреть модуль Bootstrap Layouts, ведь вы по образу и подобию сможете сделать настраиваемые лэйауты и для вашего сайта. Ниже скрины настроек лэйаута и списка выбора блоков:

Кнопка «Create Custom Block» заслуживает отдельного внимания — она создаёт обычный блок, но параметр reusable у него имеет значение FALSE. Это значит, что этот блок нельзя будет нигде повторно использовать, он не появится на странице «Пользовательские блоки» или «Схема блоков», а редактировать его можно будет только по «карандашику» из формы редактирования лэйаута. Если вы хотите использовать блоки повторно, то создайте блок обычным способом через меню Структура → Схема блоков → Добавить блок и выберите этот блок из списка.

Преимущества Layout Builder перед похожими модулями

1. Можно настраивать лэйаут как для типа сущности в целом, так и для отдельной сущности.

2. Можно ставить несколько лэйаутов подряд.

3. Более быстрый доступ к редактированию лэйаутов (по сравнению с Page Manager, где нужно было кликнуть 4 ссылки, чтобы добраться до страницы с перетаскиванием блоков) и в целом боле удобный UX.

4. Более наглядный интерфейс — редактирование происходит в теме сайта по умолчанию, то есть все стили применяются сразу, а блоки при возможности показываются с нужным содержимым (иногда используются плэйсхолдеры, в зависимости от особенностей самих блоков). Также, по субъективному ощущению, формы и ajax-коллбэки у Layout Builder работают значительно быстрее, чем у Page Manager.

Ложка дёгтя

Обзор был бы нечестным, если бы не были затронуты недостатки.

Первый недостаток: некоторые элементы интерфейса пока сыровато свёрстаны и могут «разваливаться» на некоторых темах. Но это очень легко решается, ведь для редактирования используется основная тема сайта. Мне просто понадобилось добавить несколько строк CSS в свою тему, чтобы всё смотрелось хорошо.

Второй недостаток: Layout Builder не может полностью заменить Page Manager, ведь лэйаут билдер — это просто настройка отображения сущностей, соответственно, нет возможности перекрыть существующий путь, создать разные варианты для разных ролей или создать страницу с несколькими аргументами. Правда для себя я этот вопрос решил через кастомный модуль, который создаёт ещё один тип Section Storage, который можно прикрепить к своей Config Entity, и вызвать в своём кастомном контроллере, но это вариант для очень продвинутых.

Третий недостаток: модуль пока ещё экспериментальный, поэтому есть некоторые «детские болячки» и для некоторых вещей приходится ставить патчи, но насколько мне известно, часть этих «болячек» будут исправлены с выходом версии 8.7.

Как бы то ни было, взвесив все за и против, по личному опыту использования уже более, чем на пяти проектах, я однозначно могу сказать, что Layout Builder значительно лучше, чем Page Manager.

И напоследок пару советов, как использовать лэйауты более эффективно

1. Вы можете создать тип ноды, в которой не будет вообще никаких полей (даже Body можно выпилить), оставить только метатеги. Это позволит вам собирать произвольные страницы из произвольного набора блоков. Очень удобно для главной страницы, страниц-лэндингов и просто страниц с уникальным дизайном.

2. Создавайте новые типы блоков подключайте лэйауты к ним, а потом используйте эти блоки в лэйаутах нод или терминов таксономии. Добавляйте в блоки параграфы. У меня есть тип «Блок с виджетами», у которого виджеты — это разные типы параграфов на выбор.

3. По аналогии с «пустым» типом нод вы можете создать пустой тип блока, в который можете собирать другие блоки.

Перечисленные методы позволят вам неограниченно вкладывать лэйауты в лэйауты, как результат, вам больше не понадобится создавать в теме 100500 шаблонов.