Общая информация о карточке товара
Переход на экран
Карточка товара (Product Detail Page (PDP) - страница интернет-магазина, на которой отображается детальная информация о товаре (описание, цена, цвет, наличие/отсутствие на складе и др.).
Чтобы перейти на карточку товара, тапните:
- на мини-карточку товара на листинге каталога (PLP)
- на мини-карточку товара на рекомендательных полках (например, "Бестселлеры"/"Current bestsellers" или "Лучшее предложение"/"Best suggestion" на главной)
- в истории заказов (как на экране "Все заказы", так и на экране с деталями конкретного заказа)
Отображение и поведение экрана
На экране отображаются:
1 - поисковая строка
2 - текущая локация
3 - галерея изображений товара
4 - информация о наличии/отсутствии товара на складе (если товар есть, то отображается информация об остатках в формате "X шт. в наличии")
5 - артикул товара (в формате "Арт.ХХХХХХХ"/"Art.Nr.ХХХХХХХ") (некликабельно)
6 - наименование товара (некликабельно)
7 - цена товара с символом валюты (если товар на скидке, то отображаются 2 цены: полная (перечеркнута) и акционная) (некликабельно)
8 - подробное описание товара (некликабельно)
9 - (опционально) блок с характеристиками товара (некликабельно)
В блоке "Характеристики" отображаются характеристики, заданные товару и его категории в BackOffice. Если характеристик на продукте или его категории нет или они были удалены администратором в BackOffice, то блок не отображается на карточке товара.
Подробнее о присвоении товару характеристик в Backoffice можно узнать здесь.
10 - (для мультивариативных товаров) варианты товара
11 - кнопка добавления товара в корзину
Редактирование данных о товаре происходит через BackOffice.
Подробнее читайте в Работа с товарами в BackOffice.
При скролле экрана вниз или вверх хедер, строка поиска и текущая локация "прикреплены" к верху экрана, а цена с кнопкой “В корзину”/"Add to cart" - к низу экрана.
Вы можете ознакомиться со всеми изображениями товара:
- по тапу на миниатюры изображений под основным фото (если у товара только одно фото, то карусель не отображается)
- по свайпу влево/вправо
В случае мультивариативных товаров при переключении между вариантами продукта вы попадете на экран, предназначенный для каждого отдельного варианта товара (/product/{productId}/{variantId}). Порядок отображения вариантов на карточке товара совпадает с порядком, заданным в BackOffice.
Подробнее о работе с мультивариативными товарами в BackOffice можно узнать здесь.
По тапу на кнопку "В корзину"/"Add to cart" происходит добавление товара в корзину. Если же товара в наличии нет, то на карточке будет отображен соответствующий статус товара ("Нет в наличии"/"Out of Stock"), а кнопка добавления в корзину будет не кликабельна и графически выделена серым цветом.
