Как настроить акцию «4 пиццы - 2 в подарок» на Tilda

Владельцы интернет-магазинов на платформе Tilda часто сталкиваются с необходимостью реализовать сложные скидочные механики. Одна из популярных акций - при покупке четырёх пицц две самые дешёвые отдаются бесплатно. В этой статье мы разберём, как настроить такую систему с помощью встроенных инструментов Tilda и кастомного JavaScript-кода.

Принцип работы акции «4+2»

Механика проста: когда в корзине оказывается 4 пиццы, система автоматически добавляет две пиццы с наименьшей стоимостью с нулевой ценой. При увеличении количества до 8 пицц - бесплатными становятся 4 самые дешёвые позиции. Это стимулирует покупателей набирать больше товаров, увеличивая средний чек.

Как реализовать акцию на Tilda

Стандартные модули корзины Tilda не поддерживают такую логику «из коробки». Однако вы можете использовать Zero Block и JavaScript для добавления кастомной функциональности. Вот пошаговая инструкция:

Шаг 1. Подготовка данных о товарах

Убедитесь, что у каждой пиццы в каталоге указана цена и уникальный ID. Для корректной работы скрипта все товары должны быть добавлены в корзину через стандартную форму Tilda с атрибутами data-product-id и data-product-price.

Шаг 2. Добавление скрипта в Zero Block

Создайте блок типа Zero Block на странице корзины или на всех страницах сайта. Вставьте следующий JavaScript-код в настройки блока (через редактор кода):

// Пример упрощённого скрипта для акции 4+2
function applyPromotion() {
  const cartItems = document.querySelectorAll('.t-store__card');
  // ... логика подсчёта и обнуления цен
}

Важно: скрипт должен отслеживать изменения в корзине (добавление/удаление товаров) и пересчитывать бесплатные позиции в реальном времени.

Шаг 3. Настройка триггеров

Используйте события Tilda, такие как tcart__change, чтобы запускать функцию при каждом обновлении корзины. Это гарантирует, что акция будет применяться мгновенно.

Возможные сложности и их решение

• Конфликт с другими скриптами: проверьте, что ваш код не переопределяет стандартные обработчики Tilda. Используйте анонимные функции и изолируйте переменные.
• Обнуление цены при повторной загрузке: сохраняйте состояние акции в localStorage, чтобы после перезагрузки страницы скидка не пропадала.
• Отображение бесплатных товаров: добавьте визуальную метку «В подарок» рядом с пиццами, которые стали бесплатными, чтобы пользователь понимал механику.

Альтернативные способы реализации

Если вы не хотите писать код вручную, рассмотрите готовые решения:

• Плагины для Tilda: некоторые разработчики предлагают модули для кастомных акций (например, «Tilda Promo»).
• Интеграция с CRM: передавайте данные о корзине во внешнюю систему (например, через API) и обрабатывайте скидки на серверной стороне.
• Ручное управление: временно можно выдать промокод на скидку для двух пицц при покупке четырёх, но это менее удобно для клиента.

Рекомендации по тестированию

Перед запуском акции обязательно протестируйте её на разных устройствах и в разных браузерах. Убедитесь, что:

• При добавлении 4 пицц в корзину две самые дешёвые становятся бесплатными.
• При добавлении 5-й пиццы акция не ломается (бесплатными остаются только 2 из первых 4).
• Сумма заказа корректно пересчитывается с учётом скидки.

Если вы новичок в программировании, обратитесь к фрилансеру, специализирующемуся на Tilda. Средняя стоимость такой доработки - от 3000 до 8000 рублей в зависимости от сложности.