• 5. Я продаю в Магазине на 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 и клиент сможет подать заявку на Кредит на Покупки.

    90% считают ответ полезным Для Вас ответ оказался полезным?