gform_stripe_elements_style

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 style reference in Stripe’s documentation.

Usage

add_filter( 'gform_stripe_elements_style', 'your_function_name', 10, 2);

Parameters

  • $cardStyles array
    Array of the current styles applied.
  • $formId int
    The current form id.

Examples

Check out Stripe’s documentation to see what options are available for the styles.

add_filter( 'gform_stripe_elements_style', 'set_stripe_styles', 10, 2 );
function set_stripe_styles( $cardStyles, $formId){
	$cardStyles['base'] = array(
		'color'			=> 'purple',
		'fontSize'		=> '20px',
		'fontFamily'	=> 'Comic Sans, fantasy',
		'fontSmoothing'	=> 'antialiased'
   	);
	$cardStyles['invalid'] = array(
		'color'  => '#e5424d',
		':focus' => array( 'color' => 'red' )
	);
	return $cardStyles;
}

If your form is using the Orbital theme, use the following example.


add_filter( 'gform_stripe_elements_style', 'set_stripe_styles', 10, 2 );
function set_stripe_styles( $cardStyles, $formId ) {
	$styles = gf_stripe()->theme_layer_third_party_styles( $formId, array(), array( 'theme' => 'orbital' ) );

	$styles['base']['fontSize']                             = '18px';
	$styles['base']['::placeholder']['fontSize'] = '18px';

	return $styles;
}

If your Stripe field has the option to display multiple payment methods, see Stripe’s Elements Appearance API documentation page for all available styling options.

Placement

This code should be placed in the functions.php file of your active theme.

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.