Примеры стилизации блоков из категории товаров
Разделы каталога st310n
Разберём как стилизовать разделы каталога ST310N и сделать для них боковой скролл на десктопных и мобильных устройствах
Фильтрация каталога st310n
Научимся стилизовать внешний вид фильтров блока ST310N, цвета чекбоксов и полей ввода
Карточки товаров в блоке ST310N
Рассмотрим возможные варианты стилизации карточек каталога ST310N и сделаем свою кастомную сетку
Карточка товара на отдельной странице
Разберём как стилизовать карточку товара на отдельной странице
Хлебные крошки в карточке товара
Научимся создавать хлебные крошки и автоматически подставлять данные из названия товара
Расчёт выгоды в каталоге товаров
Создадим лейбл с автоматическим расчётом выгоды/скидки и выведем его у карточки каждого товара в каталоге
Стилизация характеристик в карточке товара
Создадим и стилизуем из обычных кусочков текста красивые характеристики в карточке товара
Расчёт выгоды в карточке товара
Добавим для каждого товара на отдельной странице лейбл с выгодой, который будет автоматически высчитываться у необходимых товаров
Дополнительная плашка с ценой и кнопкой в карточке товара
Создаём всплывающее окно снизу при скролле страницы, где будет отображаться информация о цене товара и возможность его добавить в корзину
Перенос блока выбранных фильтров
У блока ST320N переносим блок с выбранными фильтрами внутрь блока с разделами
Карточка товара как уникальная плитка с ссылкой
Из стандартного товара делаем красивую плитку, которая может вести по любой ссылке
Цена рядом с кнопкой корзины
Переносим блок со старой и актуальной ценой рядом с кнопкой корзины
Варианты добавления иконок в кнопку корзины
Рассмотрим 3 варианта, как можно добавить иконки в кнопку корзины и сделать её интереснее