Я продаю в Магазине на Kaspi.kz. Как разместить кнопку «Купить в кредит» на моем сайте?
Обновлен
19.03.2024
Для этого добавьте код кнопки в код страницы. Заполните атрибуты своими значениями.
Атрибут
Значение
data-merchant-sku
артикул товара, который вы используете в Магазине на Kaspi.kz
data-merchant-code
код вашего магазина
Скопируйте его в веб-версии кабинета продавца → Настройки → ID магазина
data-city
код города
Выберите кнопку в зависимости от места ее размещения:
Описание товара
Плоская кнопка (flatButton)
Скопировано
<!-- main way to add button on page -->
<div class="ks-widget"
data-template="flatButton"
data-merchant-sku="data-merchant-sku"
data-merchant-code="data-merchant-code"
data-city="750000000"
data-style="desktop"
></div>
Красная кнопка
Скопировано
<!-- main way to add button on page -->
<div class="ks-widget"
data-template="button"
data-merchant-sku="data-merchant-sku"
data-merchant-code="data-merchant-code"
data-city="750000000"
></div>
Синяя кнопка
Скопировано
<!-- main way to add button on page -->
<div class="ks-widget"
data-template="button"
data-merchant-sku="data-merchant-sku"
data-merchant-code="data-merchant-code"
data-city="750000000"
data-style="bigBlue"
></div>
Если вы размещаете динамическую кнопку, вызовите ksWidgetInitializer.reinit(), когда код с <div> будет добавлен в DOM. Чтобы это проверить, нажмите клавишу F12 на нужной странице и найдите тег в панели разработчика.
Код в тегах <script> нужно разместить один раз — перед финальным тегом </body>.
Динамическая кнопка
Скопировано
<!-- it's a placeholder for dynamic example -->
<div id="dynamic"></div>
<!--onpage script, should be added once, before closing </body> -->
<script>(function(d, s, id) {
var js, kjs;
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = 'https://kaspi.kz/kaspibutton/widget/ks-wi_ext.js';
kjs = document.getElementsByTagName(s)[0]
kjs.parentNode.insertBefore(js, kjs);
}(document, 'script', 'KS-Widget'));</script>
<!-- Example: adding another button placeholder dynamically after 1sec -->
<script>
setTimeout(function () {
document.getElementById('dynamic').innerHTML = '<div class="ks-widget" data-template="button" data-merchant-sku="data-merchant-sku" data-merchant-code="data-merchant-code" data-city="750000000" ></div>'
// you should run this method to recheck buttons in DOM:
ksWidgetInitializer.reinit()
}, 1000)
</script>
Результаты поиска
Маленькая кнопка
Скопировано
<!-- main way to add button on page -->
<div class="ks-widget"
data-template="flatButton"
data-merchant-sku="data-merchant-sku"
data-merchant-code="data-merchant-code"
data-city="750000000"
data-style="small"
></div>
Мобильная версия сайта
Кнопка для мобильной версии
Скопировано
<!-- main way to add button on page -->
<div class="ks-widget"
data-template="flatButton"
data-merchant-sku="data-merchant-sku"
data-merchant-code="data-merchant-code"
data-city="750000000"
data-style="mobile"
></div>
Когда покупатель нажмет на кнопку, карточка вашего товара откроется в Магазине на Kaspi.kz и клиент сможет подать заявку на Кредит на Покупки.