Инструкция по установке бейджа рассрочки Robokassa для Tilda
1. Быстрый старт
Бейдж Robokassa автоматически добавляется под ценой товара на странице. Для активации виджета вставьте следующий код на ваш сайт:
<script src="https://auth.robokassa.ru/merchant/bundle/robokassa-iframe-badge.js"></script>
<link rel="stylesheet" type="text/css" href="https://robokassa.com/media/widget/robokassa-tilda.css">
<script
src="https://robokassa.com/media/widget/robokassa-tilda.js"
data-merchant-id="test">
</script>
Параметрdata-merchant-id является обязательным, в него необходимо указать идентификатор Вашего магазина. В личном кабинете Робокасса перейдите в раздел Настройки → Технические настройки → Идентификатор магазина
⚠️ Примечание: Убедитесь что методы оплаты частями доступны вашему магазину, в ином случае бейдж не будет отображаться на сайте.
После подключения будет применена стандартная тема:
theme="light"
colorScheme="accent"
2. Кастомизация внешнего вида
Вы можете изменить цветовую схему бейджа, добавив параметры в тег <script>:
<script src="https://auth.robokassa.ru/merchant/bundle/robokassa-iframe-badge.js"></script>
<link rel="stylesheet" type="text/css" href="https://robokassa.com/media/widget/robokassa-tilda.css">
<script
src="https://robokassa.com/media/widget/robokassa-tilda.js"
data-merchant-id="test"
data-theme="dark"
data-color-scheme="primary">
</script>
3. Доступные параметры
| Атрибут | Возможные значения | По умолчанию | Описание |
|---|---|---|---|
data-theme | light, dark | light | Цветовая тема бейджа |
data-color-scheme | primary, secondary, accent | accent | Цветовая схема бейджа |
4. Установка в Tilda
Чтобы добавить Robokassa Badge в проект Tilda:
1.Перейдите в Мои сайты → Имя сайта → Настройки сайта → Ещё → Html-код для вставки внутрь HEAD.
2.В разделе Вставка кода в HEAD добавьте следующий код:
<script src="https://auth.robokassa.ru/merchant/bundle/robokassa-iframe-badge.js"></script>
<link rel="stylesheet" type="text/css" href="https://robokassa.com/media/widget/robokassa-tilda.css">
<script
src="https://robokassa.com/media/widget/robokassa-tilda.js"
data-merchant-id="test">
</script>
(или с параметрами, если хотите изменить тему)
3.Нажмите Сохранить изменения.
4.Опубликуйте сайт.
Не забудьте переопубликовать все страницы после сохранения, чтобы изменения применились.
Результат применения:
⚠️ Примечание: Для корректной работы требуется, чтобы сайт был опубликован и был подключён интернет-магазин на Tilda.