ворд-пресс.рф
Разработка

Динамический блок Gutenberg: block.json и серверный рендер PHP

Чем динамический блок отличается от статического, как устроены block.json и render.php и как проверять вывод.

Опубликовано: 10.10.2026Обновлено: 10.10.2026

Динамический блок Gutenberg формирует итоговый HTML на сервере при показе страницы. Он подходит для актуального списка записей, статистики или карточки данных, которая должна обновляться без пересохранения каждого материала. Для статического текста или простого оформления часто достаточно обычного блока.

Почему блок динамический

Статический блок обычно сохраняет HTML в содержимом записи. Динамический регистрирует render_callback или свойство render в block.json — WordPress вызывает PHP при отображении. Это полезно, когда данные меняются сами по себе.

Минимальная структура

my-latest-block/
├── my-latest-block.php
└── blocks/
    └── latest/
        ├── block.json
        └── render.php

Файл block.json описывает метаданные. Это учебный каркас серверного рендера, не полноценный редакторский блок: чтобы блок выбирался и настраивался в редакторе, понадобится корректно зарегистрированный editorScript и UI (см. официальные примеры).

{
  "$schema": "https://schemas.wp.org/trunk/block.json",
  "apiVersion": 3,
  "name": "wpr8/latest-note",
  "title": "Последняя заметка",
  "category": "widgets",
  "render": "file:./render.php",
  "attributes": {}
}

Регистрация в основном файле плагина:

<?php
/** Plugin Name: Example Latest Block */
add_action( 'init', function () {
    register_block_type( __DIR__ . '/blocks/latest' );
} );

Файл render.php выполняется WordPress при выводе блока:

<?php
$latest = get_posts( array(
    'numberposts' => 1,
    'post_status' => 'publish',
) );
if ( empty( $latest ) ) {
    return;
}
$post = $latest[0];
echo '<div ' . get_block_wrapper_attributes() . '>';
echo '<a href="' . esc_url( get_permalink( $post ) ) . '">';
echo esc_html( get_the_title( $post ) );
echo '</a></div>';

Пример учитывает экранирование текста и URL. Для production дополните доступность, кеширование при нагрузке, поддержку переводов и ограничения на выборку данных.

Почему не видно блок в редакторе

  • Файл block.json найден, но не подключён клиентский скрипт редактора.
  • Ошибка сборки JS или несовместимость библиотеки блоков.
  • Название namespace/block-name совпадает с другим зарегистрированным блоком.
  • В render.php появилось предупреждение PHP и ломает вывод.

Вывод HTML в редакторе обычно требует предусмотренного предпросмотра; сам факт наличия render.php не создаёт полнофункциональный интерфейс edit.

Проверка результата

  1. Установите плагин только в тестовый WordPress.
  2. Убедитесь, что блок зарегистрирован и доступен в редакторе после подключения редакторского UI.
  3. Опубликуйте страницу и сравните серверный HTML с ожидаемым.
  4. Создайте новую запись; содержимое блока должно обновиться без редактирования страницы.
  5. Проверьте пустую выборку, кеш и корректность ссылок.

Базовый вариант создания Gutenberg-блока разобран в первом руководстве. Здесь главное — устройство серверного рендера и контроль данных на выходе.

Источник: https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/creating-dynamic-blocks/

Материал был полезен?

Помогите нам сделать материалы точнее и понятнее.