Вопрос или проблема
Я начинаю разрабатывать тему WordPress, используя Gutenberg. Я никогда раньше не работал с Gutenberg, но поскольку поддержка Classic Editor, возможно, закончится в следующем году, я хочу использовать его сейчас, чтобы не перестраивать тот же сайт для клиента снова в следующем году. Я использую Sage 10.
Я понимаю, как создавать блоки (с ACF Pro или нативно), но что меня смущает, так это структура темы/иерархия шаблонов.
Я прочитал всю документацию здесь: https://developer.wordpress.org/block-editor/how-to-guides/themes/.
Но структура с папками block-templates и block-template-parts мне очень непонятна. Здесь нет PHP, только HTML файлы. Я не вижу никаких файлов из классической иерархии шаблонов.
В основном я хочу добиться следующего: создать шаблоны для записей, CPT и пользовательских шаблонов. Я не хочу, чтобы пользователь изменял порядок блоков, я хочу, чтобы он только редактировал контент, и ничего больше. Я хочу, чтобы редактор контента выбирал шаблон, и тогда блоки этого шаблона отображаются, и он может их редактировать, как в классическом способе.
Я видел, что можно сделать что-то вроде этого, где можно зарегистрировать шаблон и заблокировать список блоков, но я не могу найти подобный способ для пользовательских шаблонов.
Итак, мои вопросы:
- Есть ли способ создать пользовательский шаблон с зарегистрированными блоками и заблокировать их, чтобы когда редактор выбирает этот шаблон, он мог только редактировать содержимое блока? Какой рекомендованный способ?
- Существует ли иерархия шаблонов в темах Gutenberg? Что такое block-templates и block-templates-parts?
Технически сейчас есть два способа создания тем. Один из них – старый стандартный способ, где используются PHP-шаблоны (которые следуют традиционной иерархии шаблонов). Другой – блочные темы, использующие блоки для всего.
Моя рекомендация – пока придерживаться традиционного способа. Полное редактирование сайта, которое является частью работы с блочными темами, все еще находится в зачаточном состоянии, и вы все еще можете использовать редактор Gutenberg со старым методом создания шаблонов. Я делаю это исключительно в своей работе.
Что я обычно делаю – включаю в свою тему папку blocks, в которой находится мой файл package.json. Здесь я размещаю все, что касается моей темы, связанное с Gutenberg. У меня есть подпапка (в blocks/src/) для blocks, plugins, block-styles и т. д. Затем я добавляю весь необходимый JS для создания этих блоков и плагинов. Затем, для создания шаблонов, я использую стандартные файлы шаблонов .php (например, archive-post_type.php, single.php и т. д.).
При регистрации пользовательского типа записи можно указать “шаблон” блоков по умолчанию:
register_post_type('post_type_slug', array(
// ...
'show_in_rest' => true, // Убедитесь, что это включено, чтобы загружался редактор Gutenberg
'template' => array(
array('core/heading', array(
'level' => 2)
),
array('core/paragraph'),
),
));
Также можно заблокировать шаблоны, если вы хотите. Смотрите template_lock для своих вариантов.
Я написал некоторые другие ответы на SO о таких вещах, как как получить и установить пользовательское мета-поле записи с использованием Gutenberg, и общие лучшие практики, которые я использую при работе с пользовательскими типами записей в Gutenberg. Я бы посоветовал ознакомиться с ними тоже.
Ответ или решение
Работа с темами WordPress, использующими редактор Gutenberg, требует определенного понимания структуры и иерархии шаблонов. Если вы новичок в Gutenberg, важно понять, как создаются и структурируются темы с помощью этого редактора.
Структура и Иерархия Тем Gutenberg
В отличие от традиционных тем WordPress, которые полагаются на PHP-шаблоны и используют стандартную иерархию шаблонов, блоковые темы основываются на HTML-файлах и структурах блоков. Существует два основных каталога: block-templates и block-template-parts.
- block-templates: Этот каталог содержит полные шаблоны страниц, которые описываются с помощью блоков.
- block-template-parts: Здесь находятся части шаблонов, например, header, footer и другие повторяющиеся компоненты, которые можно переиспользовать на разных страницах.
Основное отличие в том, что блоковые темы предназначены для полной работы с визуальным редактором блоков, минимально включая PHP и делая акцент на HTML и JSON для описания структуры.
Создание Пользовательских Шаблонов с Заблокированными Блоками
Если ваша цель — создать шаблоны, в которых пользователи могут редактировать только содержимое блоков, но не их порядок, вы можете использовать механизм блокировки. Это достигается через установку templateLock параметра при регистрации блоков в рамках шаблона.
Пример для Кастомного Типа Записей (КТЗ):
register_post_type('post_type_slug', array(
// ...
'show_in_rest' => true, // Включение поддержки редактора Gutenberg
'template' => array(
array('core/heading', array(
'level' => 2),
),
array('core/paragraph'),
),
'template_lock' => 'all', // Блокирует добавление/удаление/перемещение блоков
));Это позволяет создать фиксированные шаблоны блоков для КТЗ, которые редакторы могут только заполнять содержанием.
Способы Создания Пользовательских Шаблонов
-
Стандартный метод с PHP-шаблонами: Включает использование
template-partsи шаблонов типаsingle.php,archive.phpи т.д. Это особенно актуально для тех, кто только начал работать с Gutenberg и хочет сохранить привычный рабочий процесс. -
Блоковые темы: Использование HTML и JSON для описания структуры страниц. Более современный подход, который лучше интегрируется с будущими возможностями WordPress.
Рекомендации
На этапе освоения Gutenberg рекомендуется продолжать использовать стандартный подход, интегрируя блоки в пределах того, что вам уже известно, например, с помощью Sage 10. Это позволит вам гибко адаптироваться к изменениям, поддерживая традиционную структуру при интеграции новых возможностей редактора блоков.
Оптимизация под SEO включает встраивание ключевых слов, таких как "Gutenberg", "WordPress тема", "блоковые шаблоны", чтобы привлечь релевантные поисковые запросы.
Заключение
Переход на Gutenberg и блоковые темы позволяет избежать потенциальных проблем в будущем, таких как прекращение поддержки Классического редактора. Вы можете воспользоваться гибкостью WordPress, чтобы интегрировать Gutenberg, сохраняя привычные процессы разработки. Это обеспечит вашему клиенту стабильность и актуальность разработанного веб-ресурса в долгосрочной перспективе.