# Shop Pay installments

## Overview

Displays Shop Pay installment messaging for the cart or the current product using Shopify payment terms. The block hides itself when installments are not available so the layout does not shift.

## Common use cases

* Show installment messaging on product templates next to price or buy buttons
* Show cart-level installment messaging in the cart drawer or cart page
* Match the banner to your color schemes and padding like other utility blocks

## Block settings

### General

| Setting                | Description                             | Options                   |
| ---------------------- | --------------------------------------- | ------------------------- |
| Show advanced settings | Reveals device visibility for the block | Checkbox (default: false) |

### Content

| Setting          | Description                                                        | Options                              |
| ---------------- | ------------------------------------------------------------------ | ------------------------------------ |
| Installment type | Whether installments follow the cart total or the selected product | <p>• Cart (default)<br>• Product</p> |

### Spacing

| Setting                   | Description                               | Options                   |
| ------------------------- | ----------------------------------------- | ------------------------- |
| Enable horizontal padding | Adds horizontal padding around the banner | Checkbox (default: false) |
| Enable top padding        | Adds top padding                          | Checkbox (default: false) |
| Enable bottom padding     | Adds bottom padding                       | Checkbox (default: false) |

### Color

| Setting      | Description                 | Options                                                                                                                                                     |
| ------------ | --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Color scheme | Background and text pairing | <p>• Body background (default)<br>• Body foreground<br>• Accent 1–3<br>• Shade 1–3<br>• Primary<br>• Secondary<br>• Tertiary<br>• Blur<br>• Transparent</p> |

### Display

| Setting    | Description                        | Options                                                                                                                            |
| ---------- | ---------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
| Visibility | Controls when the block is visible | <p>• All (default)<br>• Mobile only<br>• Desktop only</p><p><br><br>Visible when <strong>Show advanced settings</strong> is on</p> |