Добро пожаловать, разработчики WordPress. Пришло время для последнего месячного обзора, который охватывает все, что вам нужно знать, чтобы создавать плагины и темы на основе WordPress.
Если вы здесь впервые, это регулярная серия, где вы можете получить обзор событий за последний месяц. Пост охватывает только новости, которые относятся к расширению WordPress. Вы можете ознакомиться с предыдущими выпусками:
В майском выпуске 2023 года есть много интересного. При тестировании функций, упомянутых в этом посте, убедитесь, что вы используете последнюю версию WordPress и по крайней мере Gutenberg 15.7.
Прежде чем погрузиться в основные моменты прошлого месяца, не забудьте уделить время истории WordPress, поскольку ей исполняется 20 лет 27 мая 2023 года. Вы также можете присоединиться к официальному 20-дневному празднованию, которое началось 7 мая, и посетить специальный сайт 20-й годовщины WordPress.
Основные моменты
Селекторы блоков API
API селекторов был стабилизирован в Gutenberg 15.5 и будет доступен в WordPress 6.3. Он позволяет настраивать CSS-селекторы, используемые при генерации стилей для блоков. Это изменение означает меньше обходных путей и более тонкий контроль над вашим блоком.
Теперь вы можете определить селекторы своего блока в block.json
, установив объект selectors
. По умолчанию селектор root
является сгенерированным классом вашего блока. Вы можете нацеливать корень, конкретные функции (например, color
) и даже подфункции (например, typography
> text-decoration
). Вот пример block.json
использования API селекторов:
{
"selectors": {
"root": ".your-block-selector",
"color": ".your-block-selector > div",
"typography": {
"root": ".your-block-selector h2",
"text-decoration": ".your-block-selector h2 span"
}
}
}
Определение пользовательских селекторов позволяет WordPress автоматически генерировать соответствующий CSS для блока, как показано ниже:
.your-block-selector > div {
color: var( --wp--preset--color--contrast );
background: var( --wp--preset--color--base );
}
.your-block-selector h2 {
font-family: var( --wp--preset--font-family--primary );
}
.your-block-selector h2 span {
text-decoration: underline;
}
Но это только начало того, что API может сделать, и это значительно упростит создание сложных блоков. Для полного обзора посетите документацию API селекторов в руководстве по блок-редактору.
Первая тема сообщества опубликована в каталоге
Проект сообщества Community Themes начался 10 марта 2023 года, когда более 20 членов сообщества тематических сайтов присоединились к стартовой встрече. Целью было оценить интерес к созданию тем на основе блоков под официальным баннером WordPress.org, подобно темам по умолчанию, которые поставляются с ядром.
Дизайнеры, разработчики и члены сообщества объединили усилия, чтобы продвигать проект вперед. Stacks, тема для создания слайд-шоу, является первым продуктом проекта и теперь доступна в каталоге тем WordPress.
Независимо от вашего уровня опыта, вы можете присоединиться к проекту. Все, что вам нужно знать, чтобы начать работу, доступно в репозитории Community Themes GitHub.
Экспериментальный блок «Details»
Gutenberg 15.6 представил экспериментальный блок «Подробности», который можно использовать для отображения сводки и скрытия дополнительного контента. Вы также можете выбрать отображение контента по умолчанию.
Существует альтернативная версия этого блока, которая должна появиться в Gutenberg 15.8. Сейчас самое время начать его тестирование, но планируйте, что его текущая разметка и функциональность могут измениться.
Плагины и инструменты
Определение разрешенных вложенных блоков для Group и Media & Text
Поддержка атрибута allowedBlocks
теперь позволяет ограничивать вложенные блоки как для Group, так и для Media & Text. С этим изменением вы можете дополнительно настраивать опыт редактирования для ваших пользователей через пользовательские реализации или шаблоны.
Настройка рабочего каталога для wp-env run
По умолчанию относительные пути, используемые в командах wp-env run
, относятся к каталогу /var/www/html
. Патч в Gutenberg 15.7 добавляет опцию --env-cwd
, которая позволяет изменить рабочий каталог.
Проверка флага самозакрытия для HTML API
WordPress 6.3 будет содержать метод WP_HTML_Tag_Processor: has_self_closing_flag()
, который позволяет определить, присутствует ли флаг самозакрытия в HTML-теге. Вы не можете использовать его для определения того, является ли тег самозакрывающимся, только для определения того, присутствует ли флаг в синтаксисе тега. Основное применение — для работы с HTML-элементами сторонних разработчиков.
Исправления ошибок
Ошибка в WordPress 6.2 не давала возможности отображать пользовательские поля, добавленные через хук attachment_fields_to_edit
, когда пользователь загружал изображение. Это было исправлено и будет включено в WordPress 6.2.1.
Обновления документации
У руководства по редактору блоков есть новая и улучшенная страница входа, которая поможет вам лучше ориентироваться в его содержимом. Участники также обновили несколько страниц документации в руководстве с целью улучшения опыта обучения написанию блоков:
- Руководство по инструкциям > Создать базовый блок
- Справочник по API блоков > Редактировать и сохранить
- Справочник по API блоков > Метаданные в block.json
- Справочник по API блоков > Регистрация
- Справочник по API блоков > Селекторы
- Справочник по API блоков > Шаблоны
- Пакеты > Блоки
Темы
Фильтр вариаций стилей для каталога тем
Теперь вы можете начать использовать тег style-variations
в заголовке файлов style.css
для вашей блоковой темы. Каталог тем недавно добавил его в качестве фильтра для пользователей, которые ищут темы. На момент написания статьи, еще нет тем с тегом — вы можете быть первым! Конечно, ваша тема должна фактически содержать по крайней мере одну настраиваемую вариацию стиля, чтобы использовать этот тег.
Создание шаблона домашней страницы из редактора сайта
Gutenberg 15.7 добавил Главную страницу в список шаблонов, которые можно создавать непосредственно из редактора сайта. Это изменение теперь делает еще проще создавать темы из комфорта админ-панели WordPress.
Добавления и обновления инструментов дизайна блоков
Теперь вы можете добавить границу к блоку Обложка. Это в основном улучшение, но вы должны проверить, не повлияет ли добавление overflow: hidden
в CSS на настройки блока. Правило было удалено, а затем восстановлено в последующих запросах на получение.
Несколько других блоков улучшили поддержку различных инструментов дизайна:
- Встроенный контент получил поддержку
margin
- Колонки и Колонка получили поддержку
blockGap
(отображается как Пространство между блоками в интерфейсе пользователя) - Пространство теперь делает доступными предустановленные интервалы пространства темы в качестве вариантов выбора
- Время чтения позволяет вам определить цвет фона и текста
Улучшены расчеты минимального размера шрифта
В экспериментальной патче в Gutenberg 15.7 была введена логарифмическая шкала для расчета минимального размера шрифта для функции регулируемой типографики. Шкала сужается по мере увеличения размера шрифта. Вы должны протестировать дизайны своей темы, чтобы убедиться, что это обновление не отрицательно сказывается на ее типографике.
Объединены резервные навигационные элементы
До Gutenberg 15.7 логика обработки создания и получения резервных навигационных меню была проблематичной. Логика была склонна к ошибкам, а код дублировался в JavaScript и PHP. Недавнее исправление централизует логику в одной реализации. После обновления до Gutenberg 15.7 проверьте свои меню, чтобы убедиться, что они работают плавно.
Исправления ошибок
Интерфейс пользовательского блока Краткое описание теперь имеет более конкретные стилевые правила, которые должны предотвратить случайное перезаписывание CSS вашей темы компонентами редактирования.
WordPress 6.2 добавил параметр $comment_id
в функцию comment_time()
, но он не был правильно передан в get_comment_time()
. Исправление проблемы появится в WordPress 6.2.1.
Документация
В новом разделе вариаций теперь в руководстве по настройкам и стилям Global Settings and Styles объясняется, как вы можете добавлять настраиваемые стили для вариаций стилей блоков в theme.json
.
Живая ссылка [theme.json
](https://developer.wordpress.org/block-editor/reference-guides/theme-json-reference/theme-json-living/) теперь также документирует настройки customTemplates
, templateParts
и patterns
.
Значительные изменения для пользователей
Блок логотипа сайта получил улучшенный поток, который теперь позволяет задавать, заменять и сбрасывать логотип. Это приводит версию блока основной функции в соответствие с тем, что было возможно с классическими темами.
Сетчатый дизайн модального окна предложения шаблонов заменили на масонский макет. Вы должны протестировать ваши зарегистрированные шаблоны против этого изменения и оставить обратную связь на тикете, если что-то сломано.
События и ресурсы
Время разработчиков
Интерактивный API был предложен в марте 2023 года. Цель проекта — создать лучший опыт разработчика для создания интерактивных блоков. В прошлом месяце были проведены две сессии Часов разработчиков, чтобы охватить несколько часовых поясов. Вы можете посмотреть их на WordPress.tv:
Обучение WordPress
За последний месяц на сайте Learn WordPress появились три новых ресурса:
- Расширение WordPress: распространенные уязвимости безопасности
- Пользовательские типы записей и возможности
- Разработка с ролями и возможностями пользователей
Статьи блога разработчиков
За последний месяц было опубликовано три новых статьи:
- Использование шаблонных паттернов для создания нескольких дизайнов домашней страницы
- CSS для каждого блока с помощью theme.json
- Как взаимодействуют webpack и пакеты WordPress
Благодрим @bph за совместное написание и управление этими ресурсами, @oglekler и @kbat82 за обзор и обратную связь, и @joen за ассет Details/Summary.