Как мы настроили систему лояльности на Tilda: наш опыт с бонусами и внешним сервером

Недавно к нам пришел клиент с задачей: нужно сделать систему лояльности на сайте, который уже работает на Tilda. Tilda больше заточена под стильные лендинги и простые магазины, чем под сложные функции вроде бонусов и скидок, но переезжать на другую платформу клиент не хотел, да и бюджет был ограниченный. Мы решили попробовать и в итоге всё получилось. Делимся опытом, как можно провернуть такое на Tilda, если других вариантов нет.

Что сложного с Tilda и системами лояльности

Tilda не даёт прямого доступа к серверной части — у неё нет встроенного бэкенда, чтобы хранить данные пользователей, их бонусные балансы или историю покупок. Из коробки есть только формы для сбора данных и корзина с промокодами. А нам нужно было:

Если бы проект предполагал что-то масштабное, мы бы предложили WordPress или Битрикс — там такие задачи решаются проще. Но раз сайт уже на Tilda, решили работать с тем, что есть. И вот как мы это сделали.

Наше решение: JavaScript + внешний сервер

Поскольку Tilda не даёт сервер для хранения данных, мы использовали связку из JavaScript на стороне клиента и отдельного сервера для всей логики. Расскажем по шагам, как это устроили.

1. Собираем данные через JavaScriptНа сайте клиента мы поставили форму регистрации: имя, email, телефон ��� всё стандартно. Но чтобы данные не просто улетали в Google Sheets, мы добавили JavaScript, который отправляет их на наш сервер. Скрипт вставили через настройки сайта в разделе для дополнительных скриптов.

2. Храним данные на своём сервереДля хранения мы настроили отдельный сервер, где хранятся все данные о пользователях. Когда человек регистрируется, его инфа записывается в базу: имя, email, телефон и начальный бонусный баланс (например, 0). Дальше мы можем с этим работать: начислять бонусы, обновлять баланс и так далее.

3. Начисляем бонусы после покупокПосле покупки через корзину Tilda мы отправляем данные о заказе на сервер: email клиента и сумма заказа. На сервере считаем, сколько бонусов начислить (допустим, 5% от суммы), и добавляем их к балансу пользователя. Для этого используем JavaScript, который срабатывает после успешной оплаты — Tilda позволяет к этому событию привязаться.

4. Передаём данные с сервера на сайт через APIЧтобы сайт мог получать данные с сервера (например, текущий баланс бонусов пользователя или доступные промокоды), мы настроили на сервере API. Это такой интерфейс, который позволяет сайту запрашивать данные и получать ответы. Например, когда пользователь заходит в личный кабинет или хочет потратить бонусы, JavaScript на сайте отправляет запрос к нашему API (по сути, это просто адрес вроде https://our-backend.com/get-bonuses), передавая, например, email клиента. Сервер отвечает: сколько у него бонусов, какие скидки доступны и так далее. Всё это происходит в реальном времени, без перезагрузки страницы.

5. Списываем бонусы через промокодыТеперь про скидки. Мы решили не генерировать промокоды на лету, потому что на Tilda удобнее заранее создать их в настройках корзины. Так и сделали:

Когда пользователь хочет потратить бонусы, мы через JavaScript запрашиваем его баланс через API, показываем, сколько у него есть, и предлагаем выбрать скидку. Потом подставляем подходящий промокод в скрытое поле формы оплаты. Работает просто и без лишних сложностей.

Как это выглядит для клиента

Что получилось в итоге

Плюсы

Минусы

Когда лучше выбрать другую платформу

Если проект изначально предполагает сложную систему лояльности с кучей функций, мы бы посоветовали WordPress или Битрикс. Там есть встроенные инструменты для работы с пользователями, базами данных и бонусами — меньше возни. Но если у вас уже есть сайт на Tilda и хочется добавить базовую систему лояльности без глобальных переделок, то наш подход вполне рабочий.