Full Site Editing

Full Site Editing (FSE, полное редактирование сайта) — это набор инструментов и функций в системе управления контентом (CMS) WordPress, начиная с версии 5.8 (2021 год), который позволяет пользователям полностью настраивать внешний вид и структуру веб-сайта с помощью блочного редактора (Gutenberg), без необходимости писать код или использовать отдельные настройки тем оформления. FSE является частью более широкой концепции Site Editor (редактор сайта), которая объединяет редактирование страниц, записей, шаблонов, меню, виджетов и других элементов в единый интерфейс.

История

Предпосылки

До появления FSE настройка внешнего вида сайта в WordPress была ограничена. Пользователи могли изменять шаблоны тем через файлы PHP (например, header.php, footer.php, single.php) или с помощью виджетов и меню в панели администратора. Для глубоких изменений требовалось знание HTML, CSS и PHP, либо использование сторонних конструкторов страниц (page builders), таких как Elementor или Beaver Builder. Традиционные темы WordPress (классические темы) имели фиксированную структуру, которую пользователь мог лишь частично модифицировать.

Разработка и внедрение

Проект Gutenberg, начатый в 2017 году, изначально был направлен на замену классического редактора записей (TinyMCE) на блочный редактор. В версии 5.0 (декабрь 2018 года) он был внедрён для редактирования контента записей и страниц. Следующим логическим шагом стало расширение блочного подхода на всю оболочку сайта — шаблоны, заголовки, подвалы, боковые панели.

Версия WordPress 5.8 (июль 2021 года) представила первые элементы FSE: блоки для виджетов, блоки для меню и возможность редактирования шаблонов с помощью блочного редактора. Версия 5.9 (январь 2022 года) стала первой стабильной версией с полноценным редактором сайта (Site Editor), включающим интерфейс для редактирования всех шаблонов, глобальных стилей и навигации. Версия 6.0 (май 2022 года) и последующие обновления расширили функционал, добавив поддержку стилей для блоков, управление шрифтами, улучшенную работу с медиафайлами и интеграцию с шаблонами страниц.

Архитектура и компоненты

Блочный редактор (Gutenberg)

FSE базируется на том же блочном редакторе, что и редактирование записей. Каждый элемент сайта — заголовок, абзац, изображение, колонка, навигационное меню, виджет — представлен в виде блока. Блоки могут быть статическими (содержимое фиксировано) или динамическими (содержимое генерируется на основе данных, например, список последних записей). Редактор поддерживает перетаскивание блоков, их группировку, вложенность и настройку параметров через боковую панель.

Редактор сайта (Site Editor)

Редактор сайта — это отдельный интерфейс, доступный из меню «Внешний вид» → «Редактор» (при использовании темы, поддерживающей FSE). Он позволяет редактировать:

• Шаблоны (templates) — файлы, определяющие структуру различных типов страниц: главная страница, страница записи, страница страницы, архив, страница 404 и другие. Каждый шаблон состоит из блоков, которые можно добавлять, удалять и перемещать.
• Части шаблонов (template parts) — переиспользуемые блоки, такие как заголовок (header), подвал (footer) или боковая панель (sidebar). Изменение части шаблона автоматически применяется ко всем шаблонам, где она используется.
• Глобальные стили (Global Styles) — набор настроек, определяющих внешний вид всего сайта: цвета, типографика, отступы, фоны. Изменения применяются ко всем блокам и шаблонам, если не переопределены на уровне конкретного блока. Глобальные стили хранятся в JSON-файле theme.json в теме.
• Навигационные меню (Navigation) — блок «Навигация» позволяет создавать и редактировать меню непосредственно в редакторе сайта, без необходимости переходить в отдельный раздел «Внешний вид» → «Меню».

Блоки и шаблоны блоков

FSE включает сотни встроенных блоков, разделённых на категории: текст, медиа, дизайн, виджеты, встраиваемые элементы, темы. Пользователи могут создавать собственные блоки с помощью PHP или JavaScript. Шаблоны блоков (block patterns) — это предварительно скомпонованные наборы блоков, которые можно вставить в шаблон или страницу одним кликом. Они упрощают создание сложных макетов, таких как галереи, контактные формы или разделы «О нас».

Тема с поддержкой FSE

Для использования FSE необходима тема, которая поддерживает эту функцию. Такие темы называются «блочными темами» (block themes) или «темами FSE». Они не содержат традиционных PHP-шаблонов (за исключением index.php для обратной совместимости) и полагаются на HTML-шаблоны, хранящиеся в папке /templates/ и /parts/. В файле theme.json тема определяет глобальные стили, настройки блоков и поддерживаемые возможности. Примеры популярных блочных тем: Twenty Twenty-Two, Twenty Twenty-Three, Twenty Twenty-Four (все входят в состав WordPress), а также сторонние темы, такие как Ollie, Frost, GeneratePress (с поддержкой FSE).

Применение

Создание и изменение сайтов

FSE предназначен для пользователей с разным уровнем технической подготовки. Новички могут использовать готовые шаблоны блоков и глобальные стили для быстрой настройки внешнего вида. Опытные пользователи и разработчики могут создавать собственные блоки, шаблоны и стили, полностью контролируя структуру сайта. FSE позволяет:

• Изменять расположение и содержимое заголовка, подвала, боковых панелей.
• Настраивать цвета, шрифты и отступы для всего сайта или отдельных блоков.
• Создавать уникальные макеты для разных типов страниц (например, страница записи блога может иметь другую структуру, чем страница продукта).
• Добавлять динамические элементы, такие как список последних записей, форма поиска, облако тегов.

Интеграция с плагинами

FSE совместим с большинством плагинов, которые используют стандартные хуки и API WordPress. Плагины могут добавлять собственные блоки, шаблоны и настройки стилей. Например, плагины для электронной коммерции (WooCommerce) или форумов (bbPress) могут предоставлять блоки для отображения корзины, списка товаров или профиля пользователя. Однако некоторые плагины, особенно те, что полагаются на классические шаблоны или виджеты, могут требовать адаптации для полной совместимости с FSE.

Критика и ограничения

Кривая обучения

FSE требует от пользователей понимания концепции блоков и шаблонов, что может быть сложно для тех, кто привык к классическому интерфейсу WordPress. Переход от традиционных тем к блочным темам может потребовать времени на освоение нового подхода.

Производительность

Использование большого количества блоков, особенно сложных динамических блоков, может увеличить время загрузки страницы. Кроме того, редактор сайта сам по себе может быть ресурсоёмким, особенно на слабых серверах или при большом количестве блоков в шаблоне. Оптимизация производительности (кэширование, минификация, использование CDN) остаётся актуальной.

Ограничения в настройке

Несмотря на гибкость, FSE не позволяет реализовать все возможные макеты без написания кода. Например, создание сложных анимаций, нестандартных сеток или интеграция с внешними сервисами может потребовать разработки пользовательских блоков или CSS. Некоторые пользователи отмечают, что интерфейс редактора сайта менее интуитивен по сравнению с визуальными конструкторами страниц (page builders), такими как Elementor или Divi.

Зависимость от темы

FSE полностью зависит от темы. Если тема не поддерживает FSE, пользователь не может использовать редактор сайта. Переход на блочную тему может потребовать полной перестройки сайта, так как классические темы и блочные темы имеют разную архитектуру. Некоторые разработчики тем создают гибридные решения, которые поддерживают частичное использование FSE, но это может приводить к конфликтам.

Перспективы

FSE является основным направлением развития WordPress. Разработчики ядра CMS продолжают добавлять новые функции, такие как улучшенная поддержка шрифтов, управление медиафайлами, интеграция с шаблонами страниц и расширенные возможности глобальных стилей. Ожидается, что в будущих версиях FSE станет ещё более гибким и производительным, а также получит улучшенную поддержку для сложных макетов и динамических данных. Сообщество WordPress активно разрабатывает новые блоки и шаблоны, что способствует распространению FSE среди пользователей и разработчиков.

Источники

• Официальная документация WordPress: «Full Site Editing» (WordPress.org)
• Руководство по блочным темам (WordPress.org)
• Статья «What is Full Site Editing in WordPress?» (WPBeginner)
• Статья «The Ultimate Guide to Full Site Editing in WordPress» (Kinsta)
• Кодекс WordPress: «Theme.json» (WordPress.org)