Главная/WordPress Fullstack/Блупринты/Gutenberg & FSE/Нативное подключение произвольных полей (ACF / Post Meta) к стандартным блокам через Block Bindings API
К карточкам раздела «Gutenberg & FSE»
Gutenberg & FSE(ТЗ 31 из 54)
ТЗ: Нативное подключение произвольных полей (ACF / Post Meta) к стандартным блокам через Block Bindings API
Gutenberg & FSE5 шагов • +25 XP

ТЗ: Нативное подключение произвольных полей (ACF / Post Meta) к стандартным блокам через Block Bindings API

Современная разработка без лишнего JavaScript: регистрация кастомного источника данных через register_block_bindings_source(), связывание метаполей с core/paragraph и core/heading и zero-runtime производительность.

~6 ч работыУровень: JuniorWordPress 6.7+ / 7.0Block Bindings APIregister_block_bindings_source()register_post_meta()core/paragraph & core/headingZero-JS Runtime
+5 XP за шаг
Выполнено 0 из 5 шагов (0%)
Трудозатраты~6 рабочих часов
Фриланс вилка~$270 – $450 (€240 – €420)
Оценка веб-студии~$570 – $960 (€540 – €900)

ТЗ заказчика (исходный бриф):

«У нас есть десятки кастомных полей у проектов (стоимость, сроки, стек, клиент). Раньше разработчики писали под каждое поле отдельный React-блок, что раздувало код плагина. В WordPress 6.7 появилась поддержка Block Bindings API — мы хотим подключить наши метаполя напрямую к стандартным блокам абзаца и заголовка прямо в админке без сторонних плагинов.»
Ключевые требования:
  • •Регистрация кастомного источника данных (Source) для Block Bindings API в PHP
  • •Связывание значений произвольных полей записи с контентом стандартных блоков core/paragraph и core/heading
  • •Поддержка форматирования вывода (префикс «Цена: », форматирование валюты и дат)
  • •Возможность выбора источника привязки в редакторе Gutenberg
  • •Полное отсутствие клиентского JavaScript — ядро подставляет данные на сервере
Ограничения проекта:
  • •Требуется ядро WordPress 6.5+ (рекомендуется 6.7+ / 7.0)
  • •Метаполя должны быть зарегистрированы через register_post_meta() с show_in_rest => true
  • •Строгое экранирование возвращаемых значений во избежание XSS
Критерии приёмки (KPI):
  • 0 Кб кастомного JavaScript для вывода метаполей
  • Мгновенная подстановка значений при рендеринге страницы
  • Сокращение кодовой базы проекта за счет отказа от микро-блоков

Конфигурация блупринта под условия проекта

Выберите архитектуру и стек — шаги роадмапа, структура файлов и примеры кода переключатся автоматически:

Пошаговое практическое руководство по ТЗ

Подробный разбор архитектуры, код реализации и советы эксперта по каждому этапу:

1
Этап 1 из 5

Регистрация метаполей с поддержкой REST API

~25 минЛегкий

Практическое руководство:

В functions.php зарегистрируйте метаполя _project_budget и _project_deadline для типа записей portfolio_project через register_post_meta(). Укажите show_in_rest: true и auth_callback.

План и контрольные точки реализации:
1Зарегистрировать метаполя через register_post_meta
2Включить show_in_rest => true
3Задать права auth_callback
Важные технические нюансы и подводные камни:

Указывайте правильный "type" (string, number, integer), чтобы ядро корректно валидировало типы.

Ожидаемый артефакт этапа:

Метаполя, доступные для блочного редактора.

PHP
<?php
// functions.php - Регистрация метаполей для Block Bindings
declare(strict_types=1);

add_action('init', function (): void {
    register_post_meta('portfolio_project', '_project_budget', [
        'show_in_rest'  => true,
        'single'        => true,
        'type'          => 'string',
        'auth_callback' => fn() => current_user_can('edit_posts'),
    ]);

    register_post_meta('portfolio_project', '_project_deadline', [
        'show_in_rest'  => true,
        'single'        => true,
        'type'          => 'string',
        'auth_callback' => fn() => current_user_can('edit_posts'),
    ]);
});
2
Этап 2 из 5

Регистрация источника через register_block_bindings_source()

~35 минСредний
3
Этап 3 из 5

Связывание метаполей со стандартными блоками в редакторе

~30 минЛегкий
4
Этап 4 из 5

Тестирование динамической подстановки на фронтенде

~20 минЛегкий
5
Этап 5 из 5

Валидация безопасности и доступности

~20 минЛегкий

Типичные грабли на этом ТЗ

2 антипаттерна

Инструменты экосистемы Fullstack AI Lab для этого ТЗ

Интеграция