Блочные темы WordPress: почему мы отказались от классических

Полное редактирование сайта, theme.json и паттерны против PHP-шаблонов и конструкторов. Что реально изменилось для клиента и для разработчика.

Переход с классической темы WordPress на блочную тему современный подход к разработке сайтов

Классическая тема WordPress — это PHP-шаблоны, которые может править только разработчик. Блочная тема переносит вёрстку в редактор: шапка, подвал, страницы архивов собираются из блоков и меняются без кода. Мы перевели студийные проекты на этот подход и делимся выводами.

Что изменилось для клиента

Раньше просьба «поменяйте телефон в шапке» превращалась в задачу разработчику. Теперь это правка в редакторе сайта, доступная контент-менеджеру. То же с блоком услуг, порядком секций на главной, текстами в подвале.

Важнее другое: клиент перестал зависеть от конструктора. Elementor и подобные плагины хранят вёрстку в собственном формате — при отказе от плагина остаётся каша из шорткодов. Блочная тема пишет обычный HTML, который переживёт смену темы.

theme.json как единая точка правды

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

{
  "version": 3,
  "settings": {
    "color": {
      "defaultPalette": false,
      "palette": [
        { "slug": "foreground", "color": "oklch(0.15 0.018 300)", "name": "Текст" },
        { "slug": "cta", "color": "oklch(0.77 0.2 140)", "name": "CTA" }
      ]
    }
  }
}

Отключение палитры по умолчанию — половина успеха. Без него в списке остаются десятки стандартных цветов WordPress, и рано или поздно кто-то выберет фиолетовый.

Паттерны вместо копирования

Секции сайта — hero, тарифы, отзывы, форма заявки — оформлены паттернами. Менеджер собирает новую посадочную страницу из готовых блоков за десять минут, вёрстка при этом остаётся фирменной.

Подводный камень

Паттерн вставляется как обычные блоки и после вставки живёт своей жизнью. Правка паттерна не меняет уже созданные страницы. Если нужен именно синхронный блок — используйте синхронизированный паттерн (бывшие переиспользуемые блоки).

Что оказалось сложнее, чем ожидали

Стили темы конфликтуют с глобальными стилями

WordPress выводит свои стили вне CSS-слоёв. Если тема использует Tailwind, чьи утилиты лежат в @layer utilities, глобальные стили WordPress выигрывают независимо от специфичности. Лечится переносом базовой типографики в @layer base.

Слаги размеров не должны начинаться с цифры

Слаг 2xl WordPress превращает в переменную --wp--preset--font-size--2-xl. Ссылка на --wp--preset--font-size--2xl молча не сработает. Называйте размеры без ведущих цифр.

Динамические блоки почти всегда нужны

Как только на странице появляются данные из базы — записи, формы с проверкой, что-то зависящее от пользователя — статичного блока не хватает. Это нормально: половина стандартных блоков WordPress тоже динамические.

Кому подойдёт

  • Сайтам, где контент меняется регулярно и силами клиента — выигрыш максимальный.
  • Проектам, которые планируют жить дольше двух лет: меньше зависимости от плагинов.
  • Не подойдёт, если нужен сложный интерфейс с состоянием — там уместнее отдельное приложение.

Что меняется в работе редактора

Главное отличие блочной темы не в технологии, а в том, кто собирает страницу. В классической теме структура зашита в PHP-шаблон: чтобы поменять порядок секций, нужен разработчик. В блочной шаблон — такая же разметка из блоков, и порядок меняется перетаскиванием.

Отсюда следствие для планирования проекта. Мы тратим больше времени на подготовку: продумываем набор секций, задаём стили в theme.json, собираем паттерны. Зато после сдачи типовая задача «добавить страницу услуги» перестаёт быть задачей для нас — редактор собирает её из готовых блоков сам.

Файл theme.json стал точкой, где живёт вся дизайн-система: цвета, шрифты, размеры, отступы. Он один и для сайта, и для редактора, поэтому предпросмотр в админке действительно совпадает с результатом — та вечная расходимость, которая раздражала в классических темах, пропала.

Где блочные темы неудобны

Сложные динамические секции всё равно приходится делать блоками с серверным рендером — обычными блоками их не собрать. Это не откат к классической теме, но и не то «всё из коробки», которое обещают обзоры.

Второе неудобство — свобода редактора. Человек, который может передвинуть любую секцию, может и сломать вёрстку. Мы решаем это ограничениями: часть блоков запрещена, часть настроек скрыта, критичные секции залочены. На это уходит время, которое стоит закладывать в смету.

  • Плагины, написанные под классические темы, иногда конфликтуют с редактором сайта
  • Отладка стилей сложнее: часть правил приходит из theme.json, часть из глобальных стилей ядра
  • Обновления WordPress чаще затрагивают именно редактор, поэтому тестировать надо внимательнее

Частые вопросы

Можно ли перевести существующий сайт на блочную тему?

Можно, но это не переключение галочки: шаблоны собираются заново, а содержимое страниц переносится в блоки. По объёму это ближе к разработке новой темы, чем к обновлению. Смысл появляется, если сайт всё равно требует редизайна.

Обязательно ли отказываться от привычных плагинов?

Нет. Формы, SEO, кеширование, коммерция работают как раньше. Проблемы возникают у плагинов, которые вмешиваются в вывод шаблона — конструкторы страниц и старые слайдеры. Их проверяем до начала работ.

Переход стоит примерно неделю работы на средний сайт. Окупается на первых же двадцати правках, которые клиент делает сам.

5 мин чтения
ЕГЕРПРО

ЕГЕРПРО

Команда студии ЕГЕРПРО: разработчики, дизайнеры, SEO-специалисты и специалисты по технологиям искусственного интеллекта. Создаём сайты и веб-сервисы, внедряем решения на основе искусственного интеллекта и автоматизацию, работаем над скоростью и продвижением сайтов. Пишем только о технологиях и подходах, которые проверили на реальных клиентских проектах.

Нужен сайт, который так же разобран по деталям?

Оценим задачу бесплатно и пришлём смету со сроками.

Читайте также

Похожие статьи

Сайт в разработке информация наполняется. Часть разделов может быть неполной.