Top.Mail.Ru
Loading...
No-code платформа для интеграции с российскими сервисами
Адаптер
Мы в соцсетях
Ответим на вопросы
Техподдержка
Образовательные курсы и гайды для IT-специалистов
Академия
Клиентам
О нас
Плагин для Тильды
Партнерам
Академия
Расширение
Техподдержка
Модификации
Обучение
Профиль
Подписка
Партнерка
Новости
Шаблоны
Идеи
Услуги
NLM213 • ВРЕМЯ НАСТРОЙКИ: 5 МИНУТЫ

Как связать остаток товара и кнопку «В корзину» из ST200 с зеро блоком на Тильде?

Эта модификация связывает остаток товара из стандартного блока магазина Тильды с элементами в вашем Zero Block. При наличии товара она делает кнопку кликабельной для добавления в корзину и показывает остаток. Когда товар заканчивается, она меняет текст и внешний вид кнопки в Zero Block, опционально превращая ее в ссылку на предзаказ или другую страницу.
Инструкция

Эти настройки позволяют связать конкретные товары из стандартных блоков магазина с элементами в вашем Zero Block и настроить их поведение.
  1. Создайте на странице Zero Block с нужной версткой дизайна.
  2. Добавьте на страницу столько блоков ST200, сколько планируете настраивать товаров. В настройках блока укажите ID товара из каталога, который необходимо выводить в Zero Block. Как это сделать? Шаг 1 и Шаг 2.
+ Добавить товар: Нажмите эту кнопку, чтобы добавить новую строку настроек для каждого отдельного товара, который вы хотите отслеживать и отображать в этом Zero Block. Для каждого товара нужна своя строка настроек.
  1. ID блока ST200: Вставьте сюда полный ID стандартного блока Тильды (например, #rec123456789), в котором находится товар, остаток которого вы хотите отслеживать.
  2. Класс кнопки «В корзину»: Вставьте сюда CSS класс элемента кнопки в вашем Zero Block, которую вы хотите привязать к этому товару.
  3. Класс элемента с остатком: Вставьте сюда CSS класс элемента в вашем Zero Block, который содержит элемент с классом .tn-atom, где должен отображаться остаток товара или текст "Нет в наличии". Скрипт будет искать этот класс внутри элемента с этим классом и менять его текст.
  4. Текст кнопки «Нет в наличии»: Укажите текст, который будет отображаться в элементе с остатком (внутри .tn-atom, найденного по предыдущему пункту) при нулевом остатке товара.
  5. Непрозрачность кнопки «Нет в наличии» от 0% до 100%: Укажите значение прозрачности кнопки в Zero Block при нулевом остатке. Используйте число от 0 до 1, где 0 — полностью прозрачная, а 1 — полностью непрозрачная (например, 0.7 для 70%).
  6. Ссылка для кнопки нет «Нет в наличии»: (Опционально) Вставьте сюда полную ссылку (URL, например https://ваша-ссылка.ru, или ссылку на попап Тильды, например #popup:ваш_id_попапа), на которую будет вести кнопка в Zero Block, когда у товара нулевой остаток. Если это поле заполнено, кнопка при нулевом остатке станет обычной кликабельной ссылкой на этот адрес, с указанной прозрачностью и текстом. Если поле оставлено пустым, кнопка при нулевом остатке станет некликабельной, с указанной прозрачностью и текстом.
Важно:
  • Убедитесь, что в вашем Zero Block кнопка, которую вы привязываете (по полю "Класс кнопки «В корзину»"), содержит внутри себя элемент с классом заданным в генераторе.
  • Убедитесь, что элемент, который вы указываете в поле "Класс элемента с остатком", также содержит внутри себя элемент с классом .заданным в генераторе.
  • Используйте только один из двух сценариев для кнопки при нулевом остатке: либо оставляйте поле "Ссылка для кнопки нет «Нет в наличии»" пустым (кнопка станет некликабельной), либо заполняйте его (кнопка станет ссылкой).
  • Не ставьте вручную ссылки на кнопках в Zero Block, если вы используете поле "Ссылка для кнопки нет «Нет в наличии»" в настройках — скрипт сам задаст нужную ссылку при нулевом остатке.

Смотрите, как быстро установить модификацию

Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 4
Копировать код
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 4 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 3
И получите доступ к библиотеке из более чем 200 модификаций.
Оплатите подписку
Шаг 2
Создать аккаунт — это быстро и просто.
Войдите или зарегистрируйтесь на платформе
Шаг 1
Ведутся технические работы((
Попробуйте перелогиниться, если не помогло, загляните к нам через 20 минут...
Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 3
Копировать код
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 3 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 2
И получите доступ к библиотеке из более чем 200 модификаций.
Возобновите подписку
Шаг 1
Копировать код
Напишите в нашу поддержку — мы поможем с настройкой и внедрением.
Остались вопросы?
Шаг 3
Чтобы получить доступ к копированию кода и использовать его на сайте, выполните 3 простых шага:
Скопируйте код из генератора, вставьте его в блок T123 на вашем сайте в Тильде и опубликуйте страницу.
Настройте модификацию
Шаг 2
И получите доступ к библиотеке из более чем 200 модификаций.
Оплатите подписку
Шаг 1
Верстка на Тильде с нуля до Pro
SKU: 700.954.29
25000
р.
р.
When we first checked out our new headphones, we noticed the box said “improved bass”. We had to wonder if this was marketing jargon or the real thing? But it only took a moment to realize that bass was not kidding.
Интернет-магазин на Тильде
SKU: 700.954.29
25000
р.
р.
When we first checked out our new headphones, we noticed the box said “improved bass”. We had to wonder if this was marketing jargon or the real thing? But it only took a moment to realize that bass was not kidding.
Начать обучение
00
Осталось мест:

Изучи уникальную методику, чтобы брать проекты с большими чеками от 100 тысяч рублей.

Курс «Интернет-магазин на Тильде»

Научись создавать страницу профиля в Зеро блоке —
и получи обратную связь!

00
Осталось мест:

Курс «Верстка на Тильде с нуля до Pro»

Начать обучение
Копируем ID товара
Вставляем ID товара в блок ST200 на странице.
+ нажимаем "Заполнить поля данными товара из каталога и сохранить."