Style Options
The style of the payment form can be changed by setting the style option in the wpwlOption object before the payment widget is loaded. Valid options are:
- plain
- card
| Code Block |
|---|
<script>
var wpwlOptions = {
style: "card"
}
</script>
<script async src="https://test.oppwa.com/v1/paymentWidgets.js?checkoutId={checkoutId}"></script> |
Card Number and CVV placeholder styles
In order to change the style of the placeholders inside card-number and cvv, please use the option iframeStyle, according to the example below:
| Code Block |
|---|
<script> var wpwlOptions = { iframeStyles: { 'card-number-placeholder': { 'color': '#ff0000', 'font-size': '16px', 'font-family': 'monospace' }, 'cvv-placeholder': { 'color': '#0000ff', 'font-size': '16px', 'font-family': 'Arial' } } }</script> <script async src="https://test.oppwa.com/v1/paymentWidgets.js?checkoutId={checkoutId}"></script> |
Detailed documentation:
https://primeiropay.docs.oppwa.com/tutorials/integration-guide/customisation