В последнее время в объектив нашего внимания все чаще попадают новые функции WordPress: блочные виджеты, редактор шаблонов, блоки, поставляемые с темами и т.д. Тем не менее, один из лучших пользовательских инструментов в WordPress 5.8 – duotone-фильтр для блоков Image и Cover.
Термин «duotone» в нашем случае означает объединение двух цветов в качестве фильтра. Затем этот фильтр накладывается поверх изображения. Один цвет используется для теней (темных элементов), другой – для светов (светлые цвета).
Когда этот функционал впервые появился в Gutenberg 10.6 в мае, я успел активно с ним «поиграться». С тех пор я часто сталкивался с ним. Это мощный инструмент для редактирования медиа, который не потребует от пользователей погружения в программы редактирования изображений, позволяя менять настроение истории путем нажатия одной кнопки.
Дуотоны (дуплексы) могут быть любыми, начиная от простых оттенков серого и заканчивая миксом любых двух цветов. Тени и света можно даже инвертировать, что зависит от выбранных оттенков.
WordPress по умолчанию предлагает 8 duotone-наборов. Сюда относятся оттенки серого (grayscale), темные оттенки серого (dark grayscale), а также разные комбинации, которые позволяют создать интересные фильтры. Одни будут работать лучше, другие – хуже, все зависит от используемого медиафайла.
Как и в случае со многими другими возможностями WordPress 5.8, максимальная рабочая нагрузка ляжет на разработчиков тем. Именно им необходимо будет предложить пользователям ряд готовых опций. Новый JSON-файл темы позволяет разработчикам устанавливать набор duotone-цветов, соответствующих теме.
Задать произвольные duotone-фильтры очень просто. Для этого надо указать имя, слаг, а также два цвета в файле theme.json. В руководстве разработчиков имеются примеры создания подобных пресетов.
Пользователи не ограничены фильтрами, которые предлагаются WordPress или темами. Окно duotone позволяет выбирать любой цвет из палитры для теней и светов.
Дуотоны работают лучше всего в том случае, когда изображение имеет высокую контрастность, что означает широкий разброс между светлыми и темными цветами. Более темные тени и более светлые света делают фильтры привлекательнее в визуальном плане.
В блоке Cover пользователи могут добавлять фильтры как к изображениям, так и к видео. При этом есть доступ к обычному цвету наложения или градиенту. Это обеспечивает высокую гибкость для настройки медиафайла.
Возможность duotone работает со встроенными SVG-файлами, а потому ее использование не приводит к постоянному изменению изображений или видео. Пользователи по-прежнему могут работать с исходными медиафайлами в разных местах сайтах, не подгружая новых копий.
Дуотоны – лишь вершина айсберга. Есть также много других вариантов использования SVG-фильтров помимо простого наложения пары цветов поверх изображений. Бенце Сабо (Bence Szabo) написал обширное руководство по использованию SVG-фильтров для паттернов. Это может стать тропинкой к новым опциям фона в будущем. Возможно, далеко не все подойдет для ядра WordPress, но мне бы хотелось, чтобы авторы плагинов расширили некоторые альтернативные методики использования фильтров.
Источник: wptavern.com