На этой странице
Wix теперь обслуживает значительную долю независимых онлайн магазинов одежды, но большинство продавцов Wix Stores по-прежнему полагаются на статический бeden таблоsu в PDF или встроенную таблицу размеров. Этот пробел имеет значение: покупатели, которые не могут ответить на вопрос "какой у меня размер" в нужный момент, либо покидают корзину, либо покупают два размера и возвращают один. Решение этой проблемы на Wix требует встраивания страницы и, если вы хотите интегрировать его с вариантами товара, короткий скрипт Velo.
Wix не был разработан с нативным слоем рекомендации размера, но его API Custom Element / HTML iframe и Velo (платформа JavaScript от Wix) предоставляют вам два практических пути для добавления этого функционала. Данное руководство подробно рассказывает об обоих способах, показывает точное расположение виджета на странице товара и объясняет, как убедиться, что виджет действительно читает данные вариантов из Wix Stores, а не просто размещается поверх них.
Почему Wix Stores нуждается в этом больше, чем может показаться
Страницы товаров Wix Stores используют шаблоны: одна и та же компоновка галереи плюс форма покупки повторяется по всему каталогу, что отлично для скорости загрузки, но оставляет мало места для рекомендаций по размеру кроме выпадающего меню. Одежда и обувь уже имеют коэффициент возвратов значительно выше среднего розничного, а возвраты обуви в частности входят в число наиболее частых среди всех категорий товаров. На платформе, где большинство продавцов — небольшие или средние бренды одежды или обуви, этот структурный пробел становится еще более существенным — нет внутренней команды разработчиков, которая бы молчаливо исправила это с помощью пользовательской логики подбора размера, как это могли бы сделать продавцы на более крупной платформе.
Затраты, связанные с возвратами, хорошо документированы на уровне индустрии, даже если ваша собственная аналитика не раскрывает эту информацию. По данным National Retail Federation, объем возвратов в США в 2024 году составил примерно 890 миллиардов долларов, а уровень возвратов при онлайн покупках приближается к 19-20% (nrf.com), а McKinsey оценивает, что возвраты обходятся модным брендам более чем в 40 миллиардов долларов в год по всему миру (mckinsey.com). Виджет размера не устранит эти расходы, но он сосредотачивается на главном причине возвратов одежды: неуверенность покупателя в выборе правильного размера перед оплатой.
Два способа встраивания виджета в Wix
Wix предоставляет вам два реалистичных пути интеграции, и выбор зависит от того, насколько глубоко вы хотите интегрировать виджет в ваш каталог.
1. Встраивание HTML (Custom Element / Embed a Widget). В редакторе Wix перейдите в раздел Добавить элементы → Embed → Custom Embeds → HTML iframe, поместите его на шаблон страницы товара и вставьте код встраивания виджета (обычно тег <script> плюс элемент <div> для монтирования). Это самый быстрый способ — не требует никакого кода кроме копирования и вставки — и работает на любом плане Wix Stores, который позволяет встраивать пользовательский код.
2. Velo (платформа разработки Wix). Если вы хотите, чтобы виджет считывал выбранный покупателем вариант товара, автоматически передавал контекст ID товара/SKU, или записывал рекомендованный размер в опции товара перед добавлением в корзину, вам понадобится Velo. Включите режим разработчика на сайте, добавьте <htmlComponent> (или используйте тот же элемент iframe) на шаблон страницы товара, и используйте $w.onReady() плюс API Wix Stores Product Page (wixStoresFrontend / $w('#productPage') context) для передачи данных товара в виджет и прослушивания события size-selected.
Таблица ниже поможет вам быстро выбрать подходящий способ:
| Задача | Способ |
|---|---|
| Только показать рекомендации по размеру, без передачи данных | Встраивание HTML, без кода |
| Автоматически определять ID товара/категорию при загрузке | Velo, передать контекст при $w.onReady() |
| Записать рекомендованный размер в селектор вариантов | Velo, прослушивать событие postMessage виджета |
| Несколько шаблонов товаров (напр., платья vs обувь) | Velo, условное монтирование для каждого шаблона |
Размещение виджета на странице товара
Расположение определяет, будет ли виджет использоваться вообще. На шаблонах страниц товаров Wix, форма покупки (цена, выпадающее меню размера, кнопка добавления в корзину) расположены в фиксированной колонке, и виджет размера должен находиться непосредственно под или рядом с селектором размера — а не спрятан под описанием или на отдельной вкладке.
Несколько замечаний по расположению, специфичных для редактора Wix:
- Привяжите встраиваемый элемент к той же секции, что и выпадающее меню вариантов, чтобы он прокручивался вместе с формой покупки на мобильном устройстве, а не с галереей товаров.
- Мобильный редактор Wix обрабатывает компоновку десктопа и мобильного устройства отдельно — вам потребуется независимо переместить встраивание в мобильном представлении, так как Wix не всегда наследует компоновку десктопа 1:1.
- Если вы используете виджет на нескольких шаблонах товаров (Wix Stores поддерживает несколько), повторите этап встраивания для каждого шаблона вместо того, чтобы предполагать, что одно размещение охватывает весь каталог.
- Держите триггер видимым без прокрутки на мобильном устройстве; виджет, который появляется только после прокрутки, получит значительно меньше взаимодействия.
Это тот же принцип, рассмотренный в статье как добавить виджет рекомендации размера на Shopify — платформа меняется, но близость к форме покупки определяет использование независимо от типа витрины.
Проверка интеграции с Wix Stores
Прежде чем считать работу завершенной, проведите краткую проверку. Это поможет выявить два наиболее частых режима отказа на Wix: виджет монтируется, но не считывает контекст товара, и виджет работает на десктопе, но не на отдельной мобильной компоновке редактора.
- Загрузите активную страницу товара (не только предпросмотр редактора) — изоляция iframe в Wix ведет себя по-разному в режиме предпросмотра и опубликованном режиме.
- Подтвердите осведомленность о вариантах. Если вы используете Velo для передачи ID товара или категории, проверьте консоль браузера на предмет полезной нагрузки инициализации виджета и убедитесь, что она соответствует просматриваемому товару.
- Отдельно протестируйте мобильную компоновку, так как Wix поддерживает независимое состояние мобильного редактора.
- Проверьте процесс добавления в корзину, если вы подключили callback size-selected — убедитесь, что рекомендованный размер действительно заполняет выпадающее меню вариантов Wix, а не просто отображается в строке.
- Проверьте несколько SKU, включая те, что имеют необычные диапазоны размеров (петит, плюс-сайз, широкая ширина), чтобы убедиться, что виджет не молча отказывает на нестандартных структурах вариантов.
Ничего из этого не требует пользовательской работы на бэкенде, если вы используете маршрут встраивания HTML — это в основном инспекция редактора и браузера. Интеграции Velo требуют немного больше тестирования, так как вы полагаетесь на стабильность API фронтенда Wix при обновлениях редактора.
Где встраивается YourSizer
Виджет YourSizer разработан для точного встраивания в такой слот — он монтируется через легкий тег скрипта, поэтому маршрут встраивания HTML в Wix работает без заминок без каких-либо требуемых кодов Velo. Для продавцов, которые хотят более тесную интеграцию (автоматическое определение категории товара, или запись рекомендованного размера в выпадающее меню вариантов), то же встраивание предоставляет hooks, которые нужны Velo для чтения и действия на его выходе.
Он не требует переноса вашего каталога товаров или замены нативных опций размера Wix Stores — он работает рядом с ними, задавая покупателю несколько быстрых вопросов (или считывая сохраненные измерения при повторных посещениях) и возвращая рекомендацию размера, сопоставленную с вашей существующей таблицей размеров. Для продавцов на Wix конкретно это означает отсутствие изменений на бэкенде и отсутствие зависимости от более ограниченных интеграций приложений Wix.
Часто задаваемые вопросы
Требует ли добавление виджета размера на Wix план Wix Business или выше?
Это зависит от метода встраивания. Встраивание HTML/Custom Element доступно в планах Wix, поддерживающих пользовательский код, что для Wix Stores обычно означает любой план выше самых базовых некоммерческих уровней. Velo (режим разработчика) бесплатно включается на любом плане сайта, включающем Wix Stores, поэтому маршрут, основанный на коде, сам по себе не заблокирован более дорогим планом — соображения стоимости обычно связаны с поставщиком рекомендации размера, а не с платежами за платформу Wix.
Замедлит ли виджет размера мою страницу товара на Wix?
Хорошо построенный виджет загружается асинхронно и не должен блокировать начальный рендеринг страницы товара, так как он монтируется в свой собственный iframe или контейнер после загрузки основного содержимого страницы. Самый большой риск на Wix — это укладка слишком большого количества встраиваний третьих сторон (чат, отзывы, апселл, виджет размера) на один шаблон, что может складываться, даже если каждый отдельный скрипт легкий. Стоит проверить скорость страницы до и после добавления встраивания, используя собственные инструменты производительности сайта Wix или общий инструмент, такой как PageSpeed Insights.
Может ли виджет записать рекомендованный размер прямо в селектор вариантов Wix?
Да, но только через маршрут Velo. Встраивание HTML само по себе может отобразить рекомендацию покупателю, но оно не может обратиться к нативному выпадающему меню вариантов Wix Stores без кода Velo, прослушивающего событие вывода виджета и вызывающего API Wix Stores Product Page для установки выбранной опции. Это обычный следующий шаг после того, как продавец проверил базовое встраивание и хочет уменьшить дополнительный клик между "увидеть рекомендацию" и "добавить правильный размер в корзину".
Заключение
Редактор Wix и платформа Velo достаточно гибки, чтобы поддерживать виджет рекомендации размера без полной перестройки витрины, но ценность проявляется только если виджет находится там, где покупатели уже смотрят — рядом с селектором размера, а не в конце страницы. По мере того, как все больше продавцов Wix Stores в области одежды и обуви рассматривают рекомендации по размеру как базовый функционал, а не как приятный бонус, платформы и интеграции, которые делают это быстрым встраиванием вместо пользовательского проекта разработки, в конечном итоге установят норму для остального каталога.