Settings

Settings usage

Amount Limits

Set the amount limits of the product price on pageload by adding the following attributes:

min={minimum-amount}
max={maximum-amount}

🚧

Min & Max limits

This limits are set to default to 0 and 2000: make sure to modify them accordingly to your contract!

Frequency Number

Number of days between each installment. The value for Pay in Installments is 30. For Pay Later 14

frequency-number={frequency-number}

Number Of Instalment

Number of the payments with Scalapay. The values for Pay in Installments are 3 or 4. For Pay Later is 1.

number-of-instalment={number-of-instalment}

Handle changes to product amount

If the product price changes, simply add the selector of the product price component to allow the widget to watch for updates and change dynamically

amount-selectors='["#price-container"]'

For pages that can have multiple prices such as a regular price and special price, simply add multiple price selectors seperated by a comma ',' and the widget will prefer the price of the first selector

amount-selectors='["#price-container .default-price", "#price-container .secondary-price"]'

Amount value

The amount prop is used as fallback if amount-selectors prop is not defined.
The value could be the price with or without the currency (i.e. 100.00 €, 100.00).

amount={amount-value}

Update language

The Scalapay widget supports English, Italian, Portuguese, German, French and Spanish languages.
Set the language by adding the following attribute (valid values are 'en', 'it', 'pt', 'de', 'fr', 'es'):

locale={'en' | 'it' | 'pt' | 'de' | 'fr' | 'es'}

Hide

Option to hide programmatically the widget.

hide={true | false}

Update logo size

The value to resize the logo has to be between 60 and 120.
Only available for Pay in Installments

logo-size={logo-size} // (values with a range from 60 to 120)

Update currency position

Move the position of the currency before or after the amount.
Only available for Pay in Installments

currency-position={'before' | 'after'}

Update currency Display

Modify the code of the currency.
Only available for Pay in Installments

currency-display={'symbol' | 'code'}

Theme

Used to change the presentation of the widget
Only available for Pay Later

theme={'primary' | 'variant'}