Страница «Карточка товара»

«Карточка товара» — динамическая страница: для каждого товара из каталога она подставляет собственные данные — фото, название, цену, описание. Это тот же принцип, что и в динамических страницах коллекций Taptop.

Чтобы открыть страницу, перейдите на вкладку Страницы на левой панели: раздел «Магазин» → «Карточка товара».

Слой Product

На странице есть системный слой Product — именно через него страница получает данные конкретного товара. Слой можно переименовать, но нельзя удалить, скопировать или продублировать: он обязателен для работы карточки товара.

Привязка элементов страницы к полям товара доступна только внутри этого слоя. Если попробовать привязать поле к элементу за пределами Product — привязка недоступна.

Что уже настроено по умолчанию

Как только в магазине появляется хотя бы один товар, на странице «Карточка товара» автоматически формируется шаблон оформления. Часть элементов уже привязана к полям товара:

Изображение — привязано к фото товара;

Название, артикул, цена — привязаны к соответствующим полям товара;

Остаток товара — привязан к полю количества;

Описание — привязано к текстовому описанию товара.

Это можно проверить: выделите элемент (например, изображение) и на вкладке Настройки на правой панели откройте раздел «Динамические данные» — в поле «Связанное поле» будет указано «Изображение».

Если какое-то поле товара не заполнено в панели управления, элемент на странице просто остаётся пустым — верстка не ломается.

На карточке также есть блок с кнопкой добавления в корзину — виджеты Quantity и кнопка «Добавить в корзину».

Как привязать элемент к полю товара

Вы можете добавить на страницу дополнительные элементы и привязать их к нужным полям товара. Например, Производитель или Размеры.

Элементы нужно добавлять только внутрь слоя Product.

Привязка работает по тому же принципу, что и в коллекциях: выбираете элемент на странице, в настройках справа находите поле «Связанное поле» и выбираете нужное поле товара.

К каким полям можно привязать виджеты:

Text — Название, Артикул, Единица измерения, Цена, Количество, Анонс, Производитель, Ширина, Высота, Вес, Единица веса.

Image — Изображение товара или производителя.

Rich Text — Описание товара.

Элемент, у которого настроена привязка, помечается специальным значком в панели слоёв — так проще ориентироваться в структуре страницы.

Привязать поле к элементу внутри виджета со сложной вложенной структурой нельзя — только к обычным элементам страницы: Text, Rich Text, Image.

Уведомление о добавлении в корзину

При добавлении товара в корзину на сайте можно показать уведомление об успехе или ошибке. 

Чтобы управлять показом уведомления на опубликованном сайте, используйте чекбокс «Показывать уведомление» в настройках слоя Product — по умолчанию он включён.

Блок уведомления по умолчанию скрыт на холсте и в слоях. Чтобы увидеть блок на холсте и отредактировать его текст и стили, нажмите кнопку «Показать» в том же блоке настроек. 

Дальше можно переключиться между уведомлением об успешном добавлении и уведомлением об ошибке — и отредактировать текст каждого прямо на холсте.