Поддержка функций блока

Раньше автору блока приходилось для каждой настройки оформления писать свой интерфейс: палитру цветов, поле отступа, переключатель выравнивания — и затем сам выводить стили. Механизм supports снимает эту работу. Достаточно объявить, что блок умеет менять цвет фона, и редактор сам добавит нужную панель в инспектор блока, создаст атрибуты для хранения значения и сформирует классы и стили при выводе.

Так блоки ядра и сторонних плагинов получают одинаковые элементы управления, а тема через theme.json управляет ими централизованно: задаёт палитру, единицы отступов, набор размеров шрифта.

Пример в block.json

"supports": {
    "align": [ "wide", "full" ],
    "anchor": true,
    "html": false,
    "color": { "background": true, "text": true, "link": true },
    "spacing": { "padding": true, "margin": [ "top", "bottom" ] },
    "typography": { "fontSize": true, "lineHeight": true }
}

Здесь блок можно растянуть на всю ширину, задать ему HTML-якорь, цвета, внутренние отступы, внешние только сверху и снизу и размер шрифта. Ключ "html": false скрывает пункт ручной правки HTML этого блока.

Как это работает при выводе

Выбранные значения сохраняются в атрибутах backgroundColor, textColor, fontSize и style — это и есть локальные стили экземпляра. В JavaScript-части блока их подхватывает хук useBlockProps(). У динамического блока разметку строит PHP, и там обёртку выводят так:

<div <?php echo get_block_wrapper_attributes(); ?>>
    <?php echo esc_html( $attributes['title'] ?? '' ); ?>
</div>

Если забыть эту функцию, настройки в редакторе будут работать, а на сайте цвет и отступы не появятся.

Чем не является

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