Как добавить и настроить виджет товара в магазине Wix Stores?
5 мин. чтения
Виджет товара позволяет отображать один товар в любом разделе вашего сайта. При этом вы сами решаете, что будет происходить при клике на виджет: будет ли открываться страница товара или товар будет добавляться в корзину.
Примечание
Виджет товара в настоящее время недоступен в Editor X. Однако вы можете продвигать товары и другими способами, например, с помощью лендинга. Подробнее о продвижении товаров (на английском языке).
Шаг 1 | Добавьте виджет товара
Виджет товара представлен в двух стилях: компактный и расширенный. Выберите тот стиль, который подходит вам.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/11/28/65708a62-8101-482d-b750-07cd7180a768/8e3b9f2d-3e3e-4944-95d2-b63eda208879.png)
Чтобы добавить виджет товара:
- Перейдите на страницу, где вы хотите разместить виджет товара.
- Нажмите на значок Добавить
в левой части редактора.
- Выберите пункт Магазин.
- Нажмите Виджет товара.
- Перетащите виджет товара на страницу.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/11/28/8d7d3f09-9dd1-46be-b502-1251e53dc0cc/9956293c-7d61-4cab-8adc-9e15e4082866.png)
Шаг 2 | Подключите виджет к товару
Виджет товара позволяет демонстрировать один из ваших товаров и упрощает его покупку. Для настройки виджета выберите товар, который вы хотите продвигать.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8769cf44-f342-494c-b25f-cc98c9da3e82/2021/10/05/22de4372-8d5d-4251-acfe-09763cbcdab5/8db24e66-2ce0-4db0-be7f-4b6f530fb5ce.gif)
Чтобы подключить товар к виджету:
- Нажмите на виджет товара на странице в редакторе.
- Нажмите Настроить.
- Нажмите на значок стрелки
.
- Выберите товар.
Шаг 3 | Настройте поведение виджета
Теперь выберите, хотите ли вы отобразить кнопку в виджете. Если вы показываете кнопку, вы можете выбрать, куда она ведет — на страницу товара или на всплывающее окно быстрого просмотра.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/11/28/f0bc169b-fcc3-4cbc-b244-4d5c6757d8a2/f5b63941-b28a-4e95-a50b-0f95de481b90.png)
Чтобы настроить поведение виджета:
- Нажмите на виджет товара на странице в редакторе.
- Нажмите Настроить.
- Перейдите во вкладку Настройка.
- Выберите, когда будет отображаться кнопка виджета:
- Постоянно: кнопка будет видна всегда.
- Только при наведении: кнопка будет видна только при наведении курсора (в мобильной версии кнопка видна не будет).
- Никогда: кнопка не отображается.
- Выберите, что произойдет при нажатии кнопки:
- Перейти на страницу товара: покупатели переходят на страницу товара.
- Добавить товар в корзину: покупатели переходят к быстрому просмотру товара, откуда они могут добавить товар в корзину.
- Отредактируйте текст кнопки по умолчанию.
- Отредактируйте сообщение «Нет в наличии», которое появляется автоматически, когда запас товара заканчивается.
Шаг 4 | Настройте макет виджета
Каждый из двух стилей виджета товара имеет множество вариантов макета. Перейдите во вкладку Макет, чтобы выбрать и настроить понравившийся вариант.
Чтобы настроить макет:
- Нажмите на виджет товара на странице в редакторе.
- Нажмите Настроить.
- Перейдите во вкладку Макет.
- Выберите стиль, который хотите настроить:
Настройка компактного макета
Настройка расширенного макета
Шаг 5 | Настройте дизайн виджета
Выберите для виджета идеально подходящие цвета, границы, шрифты и многое другое.
![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/aab2701b-c9ef-4174-9a6c-a2358c395548/2022/11/28/4c5a1a87-16f9-4e75-ad0a-0e0a1d95e2b5/e2b59988-1743-4a00-81eb-cbf1607eb310.png)
Чтобы обновить дизайн виджета:
- Нажмите на виджет товара на странице в редакторе.
- Нажмите Настроить.
- Перейдите во вкладку Дизайн.
- Обновите дизайн, используя любой из доступных вариантов.
Подробнее о параметрах дизайна