На прошлой неделе, когда я делал последние правки в обзоре его проекта Gutenberg Forms , Мунир Камаль готовился к запуску другого типа плагина WordPress для редактора блоков. Этот назывался EditorPlus , и он создавал систему дизайна для блоков. Камаль и его команда незаметно завершили работу над версией 1.0 и через несколько дней выпустили плагин в репозиторий плагинов WordPress.
В отличие от многих других плагинов, которые создают настраиваемые блоки для достижения определенных результатов дизайна, EditorPlus предоставляет пользователям гибкость для настройки своих страниц с тем, что у них есть под рукой. Он добавляет множество вариантов дизайна для каждого из существующих блоков WordPress. На интерфейсе он оставляет небольшой след, выводя на лету только CSS, необходимый для этой страницы.
Возможно, лучшее, что есть сейчас в этом плагине, – это то, что он закладывает основу для многих функций, связанных с дизайном, которые, вероятно, найдут постоянное место в Гутенберге и, в конечном итоге, в ядре WordPress. Команда Гутенберга может заимствовать идеи, повторять и улучшать их. Мы уже видели экспериментальную контрольную площадку в Gutenberg 8.3. Было бы разумно, чтобы команда разработчиков реализовала дополнительные элементы управления дизайном в будущем. Преимущество этих элементов управления, сначала развертываемых в сторонних плагинах, заключается в том, что команда может видеть, как пользователи реагируют на них, и понимать, будут ли они работать непосредственно в Gutenberg, прежде чем совершать какие-либо действия.
В EditorPlus нет недостатка в полезностях для тех, кто любит большую свободу дизайна, не касаясь кода. По сути, плагин представляет собой редактор CSS, которому не нужно знать CSS. Он предоставляет конечным пользователям варианты наиболее необходимых функций CSS с помощью параметров блока. Это игровая площадка для тех, кто любит возиться с дизайном, и достаточно мощная, чтобы создавать уникальные макеты, не перегружая сайт во внешнем интерфейсе.
Как работает EditorPlus
После активации плагина EditorPlus конечные пользователи могут сразу же начать использовать его параметры, перейдя к редактору публикации или страницы. После вставки блока плагин делает доступными следующие восемь вкладок на панели параметров блока (каждой из них предшествует +символ):
- Граница
- Коробка Тень
- Размеры
- Задний план
- Поле
- Прокладка
- Граничный радиус
- Дополнительно
Эти вкладки будут отображаться только для основных блоков WordPress, а не для блоков сторонних плагинов. За исключением вкладки «Дополнительно», каждая вкладка соответствует своим аналогам в CSS. Вкладка Extras предоставляет более расширенную опцию «Display», которая позволяет пользователям изменять значение элемента обтекания блока displayв CSS. Этот вариант лучше оставить более опытным пользователям. Он также предоставляет возможность перехода, которая хорошо работает со стилями наведения.
На каждой вкладке параметров блока также есть загадочные кнопки «R» и «H». Кнопка «R» позволяет пользователям включать параметры реагирования, что означает, что они могут изменять стили блокировки в зависимости от экранов настольных компьютеров, планшетов и мобильных устройств. Кнопка «H» позволяет пользователям изменять дизайн в зависимости от состояния наведения курсора мыши.
Плагин содержит множество опций на небольшом пространстве. Поначалу все вкладки с новым дизайном могут показаться немного подавляющими. Однако при небольшом использовании можно легко набрать мышечную память и быстро создать нестандартные макеты.
Каждый из вариантов плагина довольно прост. А когда это не так, вы получаете мгновенную обратную связь через редактор блоков.
Есть несколько областей, которые могут оказаться проблематичными для некоторых пользователей, в зависимости от того, как их тема стилизует определенные блоки. Например, настройки ширины на вкладке «Размер» могут не всегда работать. Некоторые темы добавляют к блокам максимальную ширину, которая ограничивает общую ширину независимо от размера. Это можно отменить через плагин, но Камал решил не делать этого в версии 1.0.
Будьте осторожны с полями. В зависимости от дизайна темы для размещения контента могут использоваться левое и правое поля. Даже при установке только верхнего или нижнего поля плагин автоматически выводит 0для левого и правого полей. Это может нарушить структуру содержимого некоторых тем.
Одна из проблем, с которыми я столкнулся с плагином, заключалась в том, что стили моей активной темы преобладали над стилями плагина в целом. Например, тема Twenty Twenty по умолчанию нацелена p.has-backgroundв своем CSS на добавление пользовательских отступов. Следовательно, он имеет более высокую специфичность, чем CSS плагина EditorPlus. Эта проблема была ожидаемой, и разработчик плагина добавил ее решение в виде «важного» флажка для каждого варианта дизайна. Если пользователь ставит отметку в этом поле, он добавляет !importantк правилу стиля при выводе, что позволяет ему отменять стили темы. Это не 100% надежное решение. Ваш опыт может отличаться в зависимости от темы, но он должен работать для большинства случаев использования.
Мне не нравится идея важного флажка в пользовательском интерфейсе. Это не то, о чем пользователь должен беспокоиться. Однако это реальность мира, где темы и плагины не имеют реального способа сообщить, какие правила дизайна более важны, чем другие. Несмотря на то, что он не хотел этого в пользовательском интерфейсе, было разумным решением включить его. В противном случае слишком много правил стиля тем перезаписали бы CSS плагина.
Последние мысли
Для выпуска версии 1.0 EditorPlus – хороший старт. В своих тестах я обнаружил несколько недостатков. Любые проблемы для обычного пользователя, скорее всего, будут проявляться в виде конфликтов тем, и эти конфликты, скорее всего, будут связаны с темами с высокой специфичностью или !importantв их CSS.
Камал ясно дает понять на веб-странице плагина, что от этого плагина еще многое предстоит сделать. Я не уверен, какие функции он имеет в виду, но с нетерпением жду их. Я хотел бы видеть параметр тени для текста для блоков, связанных с текстом, таких как заголовок и абзац. Также было бы неплохо увидеть некоторые варианты дизайна изображений в блоке Галерея, а не только в элементе упаковки.
Следует ли использовать EditorPlus, зависит от того, нужны ли вам дополнительные элементы управления дизайном. EditorPlus ориентирован на людей, которым нужно что-то более похожее на легкий конструктор страниц, но которые хотят придерживаться собственного WordPress. Этот плагин является хорошей демонстрацией того, что возможно, и хорошим индикатором потенциальных вариантов дизайна, которые однажды могут появиться в WordPress.
