Gutenberg 11.3 представляет панель размеров, добавляет поддержку заполнения кнопок и ускоряет вставку

Опубликовано: 2021-08-19

Ранее сегодня Gutenberg 11.3 появился в каталоге плагинов WordPress. В последнем обновлении представлена ​​новая панель размеров для переключения параметров блока, связанных с интервалами. Блок Button теперь поддерживает управление отступами, а блок Post Featured Image имеет новые настройки ширины и высоты.

Одним из основных моментов выпуска стало повышение скорости открытия и поиска в средстве вставки. Время открытия сократилось более чем на 200 мс, с 370,35 мс до 137,28 мс. Скорость поиска увеличилась с 190,37 мс до 67,24 мс.

Последний выпуск включает упрощенную библиотеку выбора цвета. Расширенные предварительные просмотры для ссылок, функция, представленная в Gutenberg 10.9 для внешних URL-адресов, теперь работает с внутренними ссылками сайта.

Авторам тем должна понравиться сниженная специфичность таблиц стилей сброса и классического редактора. Такие изменения всегда облегчают авторам тем согласование стилей редактора и внешнего интерфейса.

Панель размеров для элементов управления интервалами

Переключение «параметров отображения» для элементов управления отступами и полями в редакторе WordPress.
Переключение элементов управления отступами и полями для блока Слоган сайта.

В Gutenberg 11.3 представлена ​​новая панель «Размеры» для блоков, которые поддерживают элементы управления полями или отступами. Эта функция добавляет кнопку с многоточием ( ... ) вместо обычной стрелки открытия/закрытия вкладки. Пользователи могут выбирать, какие элементы управления они хотят использовать.

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

Текущие недостатки двояки. После выбора отображения полей или элементов управления отступами сама панель не может быть свернута. Это усугубляет ту самую проблему, которую пытается решить новая функция — расхламление интерфейса боковой панели. По крайней мере, мне всегда нужен быстрый доступ к элементам управления интервалами. Однако мне не всегда нужно их показывать.

Вторая проблема заключается в том, что выбор пользователем того, что отображать, кажется, не сохраняется. Каждый раз, когда вы работаете с блоком, вы должны выбрать, какие элементы управления должны отображаться.

Новая панель «Размеры» — это только часть процесса настройки размеров (ширины и высоты), интервалов (отступов и полей) и соответствующих элементов управления для блоков. Работа над более продуманным решением все еще продолжается. Предположительно, команда разработчиков решит эти и другие проблемы в будущих выпусках. Однако тем, кто запускает плагин Gutenberg в продакшене, следует ожидать странностей при использовании.

Плагин Block Visibility имеет самую удобную версию такого переключателя на данный момент. Это еще не идеальное решение, но оно работает немного лучше, чем то, что сейчас есть в Гутенберге.

Заполнение блока кнопок

Настройка отступов для блока Button в редакторе WordPress.
Тестирование новой опции заполнения блока кнопок с блоками TT1.

Не секрет, что мне не нравится заполнение блока Button по умолчанию при использовании темы TT1 Blocks (блочная версия Twenty Twenty-One). Я сделал одной из своих миссий постоянное указание на это, дойдя до того, что отказался использовать блок в последнем звонке для тестирования в рамках программы FSE Outreach Program.

Негабаритная кнопка не всегда является неправильным стилистическим выбором на веб-странице. Контекст имеет значение, и я каким-то образом продолжаю сталкиваться со сценариями, в которых мне нужно что-то более урезанное. Контроль над отступами блока Button был в моем списке пожеланий в течение нескольких месяцев, и команда разработчиков Gutenberg выполнила это.

Начиная с версии 11.3, пользователи могут управлять отступами отдельных блоков кнопок. Теперь он появится в качестве опции на новой панели «Измерения», упомянутой ранее.

Молитва ответила. Теперь давайте перейдем к добавлению элементов управления отступами ко всем блокам.

Одна потенциальная проблема, с которой могут столкнуться некоторые пользователи, заключается в поддержании постоянного интервала при совместном использовании нескольких блоков кнопок. Самый простой способ сделать это — добавить и стилизовать первый, а затем продублировать его, чтобы создать другие с таким же интервалом. Это не новая проблема; это относится ко всем параметрам кнопок, когда пользователи хотят согласованности внутри группы.

Избранные элементы управления размером изображения

Блок изображения поста в редакторе WordPress с параметрами высоты, ширины и масштаба, показанными на боковой панели.
Настройка размеров блока избранного изображения публикации.

Блок Post Featured Image наконец-то получил небольшое, но удобное обновление. В прошлом у пользователей и авторов тем была только одна возможность решить, следует ли связать их с публикацией. Теперь они могут контролировать ширину и высоту изображения.

Если пользователь устанавливает высоту изображения, редактор покажет отдельную опцию «Масштаб» со следующими вариантами:

  • Обложка (по умолчанию)
  • Содержать
  • Потягиваться

Что на самом деле делают эти опции? Это был бы хороший вопрос. Даже будучи человеком, занимающимся веб-дизайном и разработкой почти два десятилетия, я иногда забываю их и должен искать их. Они являются значениями свойства CSS, object-fit для объекта, и во многих случаях могут сбить пользователей с толку.

Обложка и содержание позволяют изображению поместиться в поле содержащего элемента, сохраняя его соотношение сторон (без растяжения изображения). Разница в том, что значение обложки будет обрезано, если оно не подходит, а значение содержимого может быть помещено в почтовый ящик. Значение растяжения заполнит свой контейнер независимо от соотношения сторон.

В зависимости от соотношения сторон изображения в его контейнере каждое из значений может по существу отображать одно и то же на экране. Или они могут дать совершенно разные результаты. Сочетание этих элементов управления размерами с широким и полным выравниванием (также параметрами, связанными с шириной) также может привести к некоторым непредсказуемым экспериментам.

Дизайнер темы во мне хочет полностью отключить пользовательский интерфейс для этого и представить что-то более контролируемое: селектор размера изображения.

Такой селектор не следует путать с элементами управления шириной и высотой. Авторы темы WordPress уже много лет регистрируют пользовательские размеры изображений. Основным вариантом использования для этого были избранные изображения. Пользователи могут использовать эти размеры с текущими блоками изображений и последних сообщений. Однако у них еще нет этой опции с опубликовать избранное изображение.

Я нахожусь в лагере, который считает, что элементы управления размером изображения должны были быть первым дополнением к блоку. Это настолько неотъемлемая часть дизайна темы WordPress, что ее нельзя не учитывать, и я боролся — или, по крайней мере, ворчал — за то, чтобы авторы темы могли управлять избранными изображениями с помощью пользовательских размеров.

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

Существует множество вариантов использования новых параметров, например, автоматическое кадрирование избранных изображений сетки постов до квадрата. Я просто с нетерпением жду более надежного набора инструментов для блока Post Featured Image.