Модификация находится в бета-версии. Если нашли ошибку, сообщите о ней здесь
Подписка на библиотеку модификаций
pro
Получите доступ к расширенным настройкам, сценариям и возможностям сервиса

Корзина и избранное в Zero‑блоке

Позволяет добавить свои иконки корзины и избранного со счетчиками товаров в любой Zero‑блок на странице
 
 
Вариация

Иконка избранного в Zero‑блоке

Инструкция по установке

  • Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайта
    Этот скрипт устанавливается только один раз и помогает модификациям работать. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.
<script src="https://cdn.postnikovmd.com/tilda@1.6/mods.min.js"></script>
Скопировать код
Код скопирован!
Синхронизация обновлений включена. Новые версии и исправления будут устанавливаться автоматически.
Синхронизация обновлений включена. Модификации будут загружаться с альтернативного источника (для зарубежных проектов).
Синхронизация обновлений отключена. Текущая версия останется неизменной, независимо от обновлений.
  • Добавьте на страницу блок избранного ST110
    Он необходим для работы модификации. После его добавления стандартная иконка избранного скроется автоматически
  • Задайте кнопкам открытия избранного ссылку #wishlist
    Они могут быть расположены в любом месте страницы и иметь любой внешний вид. Если вы хотите использовать на странице несколько кнопок открытия избранного с разными стилями, задайте им разные ссылки, например, #wishlist1, #wishlist2 и т.д.
  • Задайте счётчикам товаров в избранном класс .wishlist-counter
    В качестве счётчиков рекомендуется использовать текстовые элементы Text или кнопки Button. Они точно так же могут быть расположены в любом месте страницы и иметь любые настройки. Модификация будет автоматически подставлять в них актуальное количество товаров в избранном.
    Как задать класс элементам?
  • Для вывода общей суммы заказа в корзине задайте класс .cart-total соответствующим текстовым элементам (опционально)
    Он позволит отобразить общую стоимость товаров в корзине. Если корзина пуста, элементы с этим классом скроются автоматически
  • Задайте в настройках модификации параметры и стили иконки
  • Скопируйте код и вставьте его в блок T123 в конец страницы
    Если страница товара открывается по стандартному URL /tproduct/…, добавьте перед скопированным кодом:
<script src="https://cdn.postnikovmd.com/tilda@1.6/store.min.js"></script>
<script>store.init('.uc-store', { storepart: '585579740252', style: { tabs: { active: { backgroundColor: '#FFFFFF', color: '#18181B' } }, pagination: { inactive: { opacity: 0.5 } }, skeleton: { backgroundColor: "#F3F2F7" }, favorite: { backgroundColor: '#FDECEE', backgroundImage: 'https://static.postnikovmd.com/img/icon-favorite.svg' } } })</script>
<script>store.cart('#cart')</script>
<script>store.wishlist('#wishlist', { hidecounter: true, style: { active: { backgroundColor: '#FDECEE', backgroundImage: 'https://static.postnikovmd.com/img/like-active.svg' } } })</script>
Настройки модификации

Настройки модификации

Скрывать счётчик при нуле
Скорость и тип переходов
Ссылка для иконки*
Активное состояние
Цвет фона активной иконки
Бордер активной иконки
Изображение активной иконки
Отобразится, если в корзину добавлен хотя бы один товар
<!--store.js Корзина и избранное в Zero-блоке. https://postnikovmd.com/mods/store/cart-->
<script>store.wishlist("#wishlist")</script>
Скопировать код
Скопировать код
Код скопирован!

Особенности

  • Синхронизируется с корзиной
    Счётчик обновляется автоматически при изменении корзины
  • Показывает сумму заказа
    Можно вывести общую стоимость добавленных в корзину товаров
  • Работает на стандартных страницах
    Работает в шапке, на странице каталога и на страницах /tproduct/

Документация

Элементы

Параметры

Подробная документация к модулю

Принцип работы каталога товаров, примеры его использования и инструкции по установке модификаций