Knowledgebase

Note: This is part of the developer docs and is considered custom code.
Unfortunately, we cannot provide support for custom code at this time as we do not have the additional resources that would be necessary to provide support for custom code.

If you need assistance with this, please reach out to our list of consultants for further assistance:
https://codeable.io/developers/restrict-content-pro/

The Stripe Elements card form is loaded via JavaScript and then added to your site via an iframe. This means you cannot use normal CSS if you want to customize some of the finer details of the input fields. However, there is a filter available that allows you to customize the styling via an array of settings sent to Stripe when building the card form.
Here’s a simple example for changing the font color to red:
add_filter( ‘rcp_stripe_scripts’, function ( $stripe_args ) {
$stripe_args[‘elementsConfig’][‘style’] = array(
‘base’ => array(
‘color’ => ‘red’
)
);
return $stripe_args;
} );

An array of style properties and values can be added to the ‘base’ array.
Here’s another example that changes the font size and font-family:
add_filter( ‘rcp_stripe_scripts’, function ( $stripe_args ) {
$stripe_args[‘elementsConfig’][‘style’] = array(
‘base’ => array(
‘fontSize’ => ’14px’,
‘fontFamily’ => ‘”Open Sans”, “Helvetica Neue”, “Helvetica”, sans-serif’,
)
);
return $stripe_args;
} );

For a full list of supported properties, see Stripe’s documentation article on Element options.

Please note: All of these examples serve as a guideline and are here for your convenience. We do not provide support for troubleshooting or modifying these and we do not provide support for any custom development. If you need help with any of these examples, consider hiring a developer.