Description
This filter allows styles to be used with Stripe Elements to control the look of the Credit Card field.
For more information about which styles may be applied, check out the Stripe Style object reference (when using Stripe Card field without additional payment methods enabled) or Stripe’s Elements Appearance API (when using Stripe Card field with additional payment methods element enabled).
Usage
add_filter( 'gform_stripe_elements_style', 'your_function_name', 10, 3);
Parameters
- $styles array
Array of the current styles applied. - $form_id int
The current form id. - $is_payment_element_enabled bool
Whether or not the payment element is enabled.
Examples
Set a custom style for Stripe Field
This example checks whether additional payment methods are enabled and styles the card field or payment field according to Stripe requirements.
add_filter( 'gform_stripe_elements_style', function( $card_styles, $form_id, $is_payment_element_enabled ) {
if ( $is_payment_element_enabled ) {
// reference https://docs.stripe.com/elements/appearance-api
$card_styles['variables'] = array(
'colorPrimary' => '#e0643b',
'colorTextSecondary' => '#465459',
'colorText' => '#272829',
'fontSizeBase' => '14px',
'tabSpacing' => '1rem'
);
$card_styles['rules'] = array(
'.Tab:hover' => array(
'boxShadow' => 'var(--focusBoxShadow)'
)
);
} else {
// reference https://docs.stripe.com/js/appendix/style
$card_styles['base'] = array(
'color' => '#465459',
'fontSize' => '16px',
':focus' => array(
'color' => '#272829'
)
);
}
return $card_styles;
}, 10, 3 );
Placement
This code can be used in the functions.php file of the active theme, a custom functions plugin, a custom add-on, or with a code snippets plugin.
See also the PHP section in this article: Where Do I Put This Code?
Since
This filter was added in Stripe version 2.6.
Source Code
This filter is located in GFStripe::register_init_scripts() in gravityformsstripe/class-gf-stripe.php.