gform_stripe_elements_style

• Description
• Usage
• Parameters
• Examples
• Set a custom style for Stripe Field
• Placement
• Since
• Source Code

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.