Авторы и редакторы контента всегда ищут беспроблемный, простой в использовании опыт, когда дело доходит до создания страниц. Инструменты перетаскивания (drag‑and‑drop) и WYSIWYG — это то, чего они ожидают, когда хотят создавать и оформлять страницы. Модуль Layout Builder предлагает именно такой опыт благодаря своей простой в использовании возможности создания страниц в ядре Drupal.
Layout Builder уникален и предоставляет мощный инструмент визуального дизайна, позволяющий авторам контента менять способ представления контента. Вошедший в ядро Drupal в последней версии, Layout Builder позволяет добавлять/удалять разделы для отображения контента с использованием различных макетов и настраивать страницы в соответствии с требованиями. Модуль Layout Builder также позволяет комбинировать эти разделы и создавать действительно персонализированную страницу.
Модуль Layout Builder можно использовать двумя разными способами. Его можно использовать для создания макета для каждого типа контента на веб‑сайте, а также для создания макета для отдельного элемента контента.
Знакомство с Layout Builder
Модуль Layout Builder позволяет настраивать дизайн сущностей, таких как типы контента, таксономия, пользователи и т. д. Он предоставляет простой в использовании вариант перетаскивания для создателей сайтов, чтобы размещать блоки, поля и т. д.
Модуль Layout Builder упрощает создание макетов, предлагая предварительный просмотр изменений, внесённых в процессе создания макетов. Вместо того чтобы сохранять каждое небольшое изменение, внесённое в макет, а затем проверять его на фронтенде, вы можете отслеживать внесенные изменения в процессе работы.
Установка и настройка модуля Layout Builder
Чтобы установить/настроить модуль Layout Builder, перейдите в раздел «Расширения» (Extend) административной панели Drupal и активируйте модули Layout Builder и Layout Discovery.
Примечание: Layout Builder был представлен как стабильный модуль в ядре Drupal 8.7. Поэтому убедитесь, что вы используете последнюю версию. В более старых версиях Drupal он был экспериментальным модулем.
Использование Layout Builder для настройки типа контента и таксономии
После установки модуля перейдите в «Структура» (Structure), «Типы контента» (Content types) и нажмите «Управлять отображением» («Manage display») для любого типа контента. Пока мы будем использовать тип контента «статья» («Article»).
Прокрутите вниз и нажмите «Параметры макета» («Layout options») и выберите «Использовать конструктор макетов» («Use Layout Builder»), затем нажмите «Сохранить» («Save»).
После того как вы включили Layout Builder в режиме просмотра, вы увидите опцию «Управлять макетом» («Manage layout») вместо форматировщиков полей. Вы можете использовать Layout Builder для любого из доступных режимов просмотра.
Когда вы нажмёте «Управлять макетом» («Manage layout»), вы будете перенаправлены на макет типа контента «Статья».
Добавление разделов в макет
Чтобы добавить разделы в конструктор макетов, сначала удалите раздел по умолчанию. Нажмите на иконку закрытия (как показано на скриншоте ниже). Далее вам будет предоставлена опция справа на экране для удаления раздела по умолчанию. Нажмите «Удалить» («Remove»).
Давайте добавим несколько разделов в наш макет, нажав на опцию «Добавить раздел» («Add Section»). Далее вам будут предоставлены опции справа на экране, чтобы выбрать макет для вашего раздела. Пока давайте выберем «Раздел с двумя колонками» («Two Column Section»).
У вас будет возможность выбрать ширину для «Разметки с двумя колонками». Давайте пока выберем «50%/50%». Затем нажмите «Добавить раздел» («Add section»).
После добавления у вас должна появиться ссылка «Добавить блок» («Add Block») для каждой области раздела.
Добавление блоков в области раздела
После выбора раздела для макета вы можете добавлять блоки в свой раздел. Чтобы добавить блок, просто нажмите «Добавить блок» («Add Block»), и опция «Выбрать блок» («Choose a block») появится справа.
Выбор блока
Блоки можно выбирать справа, просто нажимая на них. Вы также можете найти блоки, отфильтровав их по названию с помощью текстового поля «Фильтр по названию блока» («Filter by block name»). Пока мы выберем поле контента «Дата создания» («Authored on»).
Когда вы нажмёте на блок, который хотите добавить, вы сможете настроить форматировщик поля. После настройки форматировщика нажмите «Добавить блок» («Add Block»).
Поле контента «Дата создания» («Authored On») будет размещено слева в блоке.
После размещения поля «Дата создания» вам нужно сохранить изменения. Сохраните все изменения, внесённые в раздел, нажав на опцию «Сохранить макет» («Save Layout») вверху страницы.
Давайте попробуем добавить ещё несколько полей в наш макет, чтобы дополнительно настроить конструктор макетов.
После сохранения этого макета, если вы посетите страницу типа контента «статья», вы сможете увидеть предварительный просмотр только что созданного макета.
Переопределение макета по умолчанию
Макет, который мы только что создали, будет применяться ко всем статьям. Если вы хотите создать персонализированный макет для конкретной статьи в Drupal, нам нужно включить некоторые опции, предоставляемые Drupal для этой цели. Вы можете сделать это, выбрав «Разрешить каждому элементу контента иметь настраиваемый макет» («Allow each content item to have its layout customized»).
После включения этой опции, если вы перейдёте к статье, вы должны увидеть кнопку вкладки «Макет» («Layout»).
Теперь вы можете изменить макет, используя тот же интерфейс. Однако это изменит макет только для этого конкретного элемента контента.
Заключение
Модуль Layout Builder значительно улучшил процесс редактирования контента для создателей сайтов и редакторов контента. Простые функции перетаскивания, визуальный дизайн, персонализация, больший контроль над контентом и другие подобные функции упростили для нетехнических редакторов создание персонализированных макетов в Drupal.
