Почему совместимость блоков WooCommerce стала вопросом для рекламных плагинов

В конце 2023 года Automattic объявила, что WooCommerce Blocks закончили опциональную функцию выбора в рекомендуемой архитектуре по умолчанию для новых магазинов WooCommerce. Объявление было примечательно не столько тем, что было сказано, сколько тем, что подразумевалось. WooCommerce был построен в течение полутора десятилетий на классической иерархии шаблонов WordPress — PHP-файлы в тематических каталогах, которые плагины расширяли через крючки и фильтры, с корзиной, кассой и шаблонами продуктов, живущими в предсказуемых местах, где разработчики плагинов научились работать. Архитектура Blocks заменила эту структуру шаблонов на JavaScript-ориентированную систему блоков, в которой весь опыт взаимодействия с клиентами отображается через редактор блоков WordPress и API Storefront на основе React, а не через устаревшие шаблоны PHP. Переход является постепенным, а не резким, но его траектория однозначна, и последствия для экосистемы промо-плагинов WooCommerce все еще поглощаются торговцами, которые построили свои

#10003; GT BOGO Engine PRO включает 30-дневную гарантию возврата денег.

Вопрос совместимости не является академическим. Продавец, чей магазин работает на корзине и кассе на основе блоков - который все чаще является по умолчанию для магазинов, построенных после 2023 года, - обнаружит, что рекламные плагины, предназначенные для классической иерархии шаблонов WooCommerce, часто не могут четко интегрироваться с новой архитектурой. Обмен сообщениями на стороне корзины, который работал под старой системой, не может отображаться. Расчеты скидок, которые правильно работали через крюки PHP, не могут общаться с корзиной на основе блоков. Визуальные элементы, такие как полосы прогресса, пороговые сообщения и дисплеи значков, которые были разработаны для устаревших шаблонов, создают пустое пространство или сломанные макеты под рендерингом блоков. Продавец, который недавно построил свой магазин и выбрал промо-плагин WooCommerce без проверки совместимости блоков, работает с архитектурным несоответствием, которое ухудшается, поскольку Automattic продолжает мигрировать больше поверхности, обращенной к клиенту, в структуру блоков.

Что на самом деле меняет переход на блоки WooCommerce

Архитектурное изменение, лежащее в основе перехода блоков, имеет смысл способами, которые влияют на разработчиков плагинов больше, чем непосредственно воспринимают торговцы. Классическая иерархия шаблонов WooCommerce отображала страницы корзины и оформления заказа через файлы PHP, которые плагины могли переопределять, размещая шаблоны замены в своем каталоге плагинов. Промо-плагин, который хотел добавить панель прогресса корзины, просто зарегистрировал соответствующий шаблон переопределения, а загрузчик шаблона WooCommerce обрабатывал остальное. Модель не была элегантной - переопределения шаблонов были частым источником конфликтов плагинов - но она была понята разработчиками плагинов и предсказуема в своем поведении. Данные об отказе от корзины из пятидесяти отдельных исследований отказа от корзины, собранных в среднем по миру 70,22 процента, последовательно идентифицировали несоответствия окупаемости в качестве значимого вклада в отказ, что делает архитектурный переход более чем академической проблемой для продавцов, чей рекламный плагин создает видимую несоответствие под новым уровнем рендеринга.

Архитектура Blocks визуализирует корзину и кассу через компоненты React, которые взаимодействуют с бэкэндом WooCommerce через API Storefront. Шаблоны PHP полностью обходятся в магазинах с поддержкой Blocks. Плагины, которые хотят участвовать в корзине и рендеринге кассет, должны регистрировать расширения блоков, которые интегрируются с деревом компонентов React, передавать соответствующие данные через API Storefront и обрабатывать изменения состояния через жизненный цикл React, а не через крючки PHP. Архитектурный сдвиг не утончен. Плагин, который правильно отображается под классическими шаблонами, может полностью отсутствовать в корзине Blocks-рендеринг, потому что поверхности рендеринга принципиально разные пути кода.

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

Почему некоторые рекламные плагины провалили переход на блоки

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

Вторая категория - это плагины, которые агрессивно подключались к унаследованному конвейеру вычислений тележек, а не интегрировались с уровнем данных WooCommerce. Унаследованный конвейер проходил через конкретные крючки фильтра PHP (woocommerce_cart_calculate_fees, woocommerce_before_calculate_totals и т.п.) в предсказуемых точках вычисления тележки. Плагины, которые регистрировали обратный вызов против этих крючков и полагались на упорядочение крючков и время, как правило, работали правильно под классическими шаблонами, но производили противоречивые результаты под блоками, где одни и те же крючки могут работать в разных точках жизненного цикла рендеринга или в разных последовательностях. Расчеты скидок могут выполняться правильно, но не могут сообщать полученное состояние на дисплее тележки на основе React, производя тележки, где скидка применяется во время проверки, но невидима для клиента во время шага обзора тележки.

Третья категория — это плагины, включающие пользовательский JavaScript, предназначенный для классических страниц корзины. Наследственная WooCommerce-карта была серверной HTML-страницей с относительно предсказуемой структурой DOM, которую плагины могли улучшить с помощью jQuery или ванильного JavaScript. Под блоками корзина визуализируется через компоненты React с динамическим DOM, который часто и непредсказуемо меняется по мере взаимодействия клиента. Плагин JavaScript, который работал, выбирая конкретные элементы DOM и изменяя их, имеет тенденцию к отказу под блоками, потому что элементы либо не существуют в ожидаемой форме, либо не устанавливаются и перемонтируются через жизненный цикл React способами, которые нарушают предположения состояния плагина.

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

Что на самом деле требует совместимость блоков

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

Второе требование - интеграция уровня данных с API Storefront. Расчеты дисконтирования плагина должны сообщать свои результаты через API таким образом, чтобы корзина на основе React могла отображать правильно. Унаследованная схема вычисления скидок через крючки PHP и полагаясь на шаблон корзины для их отображения недостаточна; современный шаблон требует, чтобы плагин выставлял свои данные через расширения API, которые слой рендеринга блоков может потреблять изначально. Расширяемость API Storefront документирована, но нетривиальна для правильной реализации, и плагины, которые сделали это тщательно, как правило, значительно отличаются от плагинов, которые просто исправили свои крюки наследия, чтобы сосуществовать с блоками.

Третьим требованием является интеграция JavaScript с деревом компонентов React. Поведение плагина, которое должно реагировать на изменения состояния корзины - обновление полос прогресса по мере добавления элементов, обновление дисплеев значков по мере активации рекламных акций, анимация пороговых завершений, когда клиенты пересекают квалификационные пороги, - должно подписываться на изменения состояния React с помощью соответствующих крючков React и методов жизненного цикла компонентов. шаблон узнаваем для разработчиков React, но представляет собой существенный отход от манипуляции DOM в стиле jQuery, на которую опирались устаревшие плагины WooCommerce.

Четвертое требование — совместимость тем в экосистеме Blocks. Архитектура Blocks поддерживает гораздо более широкий диапазон вариаций тем, чем классическая иерархия, включая темы редактирования полного сайта, которые заменили традиционные структуры тем. Промо-плагин, который чисто тестировался под одной темой Blocks, может создавать визуальные проблемы под другой, особенно когда темы отличаются в обращении с механизмом слота и заполнения, который Blocks использует для расширения плагинов. Зрелые плагины, совместимые с блоками, как правило, тестировались в основных реализациях темы, а не против одной эталонной темы.

Три магазина, три траектории совместимости

Специализированный розничный торговец домашними товарами на американском Тихоокеанском Северо-Западе перенес свой магазин из классической настройки WooCommerce в архитектуру на основе блоков в начале 2024 года. Миграция показала, что существующий рекламный плагин продавца - популярный механизм скидок, который был адекватным по классическим шаблонам - создал видимые проблемы под блоками, в том числе планку прогресса корзины, которая не смогла обновиться без перезагрузки страниц и дисплеев значков, которые полностью исчезли со страниц сетки продуктов. Торговец оценил альтернативы в течение двух месяцев и мигрировал в нативную рекламную систему, совместимую с блоками, которая интегрировалась с API Storefront и деревом компонентов React. Миграция включала значимую оперативную работу, но произвела опыт взаимодействия с клиентами, который соответствовал визуальному качеству, которого достигла остальная часть магазина продавца через переход блоков.

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

Дистрибьютор B2B, обслуживающий региональные рестораны, запустил гибридную архитектуру, которая интегрировала корзину на основе блоков с классическими шаблонами каталога продуктов, которые обслуживали сложное ценообразование торговца. Гибрид требовал значимой технической координации, но производил опыт взаимодействия с клиентами, который сочетал визуальную изощренность блоков с логикой ценообразования на уровне каталога. Этот случай является иллюстративным, потому что он демонстрирует, что переход блоков не требует миграции «все или ничего» - торговцы могут запускать частичные архитектуры во время переходного окна, при условии, что их рекламный плагин достаточно сложен, чтобы интегрироваться с обеими системами рендеринга.

Почему выбор рекламного плагина все чаще определяет архитектурный путь

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

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

GT BOGO Engine, построенный GRAPHIC T-SHIRTS - роскошным брендом городского кутюра, чей собственный флагман WooCommerce работает на платформе в каталоге из более чем двенадцати сотен оригинальных проектов - был спроектирован для совместимости с классическими и основанными на блоках системами рендеринга WooCommerce. Логика скидок на стороне корзины работает через слой данных WooCommerce, а не через устаревшие шаблонные переопределения, что означает, что скидки применяются правильно независимо от того, как отображается корзина. Визуальные элементы интегрируются как совместимые с блоками компоненты для магазинов, работающих с новой архитектурой, и как классические расширения шаблонов для магазинов, работающих с архитектурой наследия, с соответствующим путем, выбранным автоматически на основе базовой конфигурации продавца. Поддержка двойной архитектуры означает, что торговцы не сталкиваются с архитектурным выбором между их предпочтительной рекламной системой и предпочтительным слоем рендеринга WooCommerce.

Что должны сделать продавцы WooCommerce о совместимости блоков в 2026 году

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

Для независимых магазинов WooCommerce, оценивающих свою рекламную инфраструктуру в 2026 году, практический вопрос заключается в том, правильно ли текущий плагин отображается в соответствии с фактической архитектурой корзины и оформления заказа продавца, или визуальные несоответствия и пробелы в рендеринге начали появляться, поскольку магазин постепенно принял компоненты на основе блоков. Торговцы, которые специально не тестировали свой рекламный плагин в корзине и страницах оформления блоков, могут работать с незамеченным архитектурным несоответствием, которое будет усугубляться, поскольку платформа WooCommerce продолжает развиваться в сторону блоков в качестве архитектуры по умолчанию.

Вопрос совместимости редко является самым захватывающим соображением при выборе рекламного плагина.

Эта статья была подготовлена редакционной группой GT BOGO Engine, промо-интеллектуальной платформой WooCommerce, построенной GRAPHIC T-SHIRTS, роскошным розничным продавцом городской моды, чей собственный магазин WooCommerce управляет платформой в каталоге из более чем 1200 оригинальных проектов.