Checkout Installments Widget

Purpose

The checkout installments widget shows a sample installment plan, including installment amounts and due dates, at the point of final decision.

Installation

Select the implementation that fits your needs:

NPM Package
Code Snippet (auto-updates)

NPM Implementation

Using npm: npm install @sezzle/sezzle-installment-widget@latest Within your checkout page, add the following code snippet to import the library:

import SezzleInstallmentWidget from @sezzle/sezzle-installment-widget

Where you want the widget to render, add the snippet from the Configuration section below, updating options to determine the price.

CDN Implementation

Within your checkout page, add the following code snippet to import the library:

<script type="text/javascript" defer src="https://checkout-sdk.sezzle.com/installment-widget.min.js"/>

Where you want the widget to render, add the snippet from the Configuration section below, updating options to determine the price.

Configuration

Template
Example
Options

<div id="sezzle-installment-widget-box"></div>
<script type='text/javascript'>
    new SezzleInstallmentWidget({
        'platform': `${yourPlatformIfSupported}`,
        'checkoutTotalElemTargetPath': `${yourPriceElementXPath}`
    });
</script>

<div id="sezzle-installment-widget-box"></div>
<script type='text/javascript'>
    new SezzleInstallmentWidget({
        'platform': 'shopify',
        // 'checkoutTotalElemTargetPath': '.payment-due__price'
    });
</script>

Either platform or checkoutTotalElemTargetPath is required, but not both.

string

The ecommerce platform which hosts the checkout page. If not supported, please refer to checkoutTotalElemTargetPath.Available options: shopify, woocommerce, 3dcart, commentsold, magento2, prestashop, shopware, opencart

string

The ID or class name of the element containing the total order amount. Provide this if platform does not support your ecommerce type, or if the default value does not work for your store’s theme.

string

default:"en"

The language in which the widget should appear. Attempts to auto-detect from html lang attribute on your website.Available options: en, es, fr

string

default:"$"

The currency symbol to show in the price. By default, the widget will mimic the currency from the total order amount targeted element if present and fallback to $ if not provided.

string

default:"US"

The country code of the shopper. This filters product offerings based on what is available for the shopper’s location.

number

default:"5"

The max number of payments you wish to display on your store. For US shoppers, 5 installments will show if checkout total is $50 or more. 4 installments will show if shopper is in CA, checkout total is less than $50, or the value for this option is set to 4.Available options: 5, 4

Sezzle

Direct Integration

Virtual Card

Assets

Express Checkout

Mobile SDKs

Other

Checkout Installments Widget

Purpose

Installation

NPM Implementation

CDN Implementation

Configuration

​Purpose

​Installation

​NPM Implementation

​CDN Implementation

​Configuration

Purpose

Installation

NPM Implementation

CDN Implementation

Configuration