mockeey

Forum Replies Created

Viewing 2 replies - 1 through 2 (of 2 total)
  • Forum: Plugins
    In reply to: [Payment Plugins for Stripe WooCommerce] Custom Form Styling for Bootstrap Form
    Thread Starter mockeey

    (@mockeey)

    1 year, 2 months ago

    Thanks again for your help!

    The code you provided didn’t work as expected, but I was able to modify it to get the desired result. For anyone facing the same issue with the Bootstrap form, here’s the working solution:

    add_filter('wc_stripe_get_card_custom_field_options', function($options) {
        $options['cardNumber'] = [
            'style' => [
                'base' => [
                    'color' => '#ffffff',
                    'fontSize' => '16px',
                    '::placeholder' => [
                        'color' => '#ffffff'
                    ]
                ]
            ]
        ];
        
        $options['cardExpiry'] = $options['cardNumber']; // Reuse same styles
        $options['cardCvc'] = $options['cardNumber'];    // Reuse same styles
        
        return $options;
    });

    Thanks again for your assistance! I believe this thread is now resolved.

    Forum: Plugins
    In reply to: [Payment Plugins for Stripe WooCommerce] Custom Form Styling for Bootstrap Form
    Thread Starter mockeey

    (@mockeey)

    1 year, 2 months ago

    Thanks for your response!

    I realize I wasn’t specific enough in my original message. I was able to style most elements using CSS, but your link was very helpful. I had to use some custom JS and CSS workarounds to achieve certain results.

    The main issue I’m facing is with the input field inside the iframe. The code I provided works fine on the original Stripe form (where the entire form is within an iframe), but it doesn’t apply when using the Bootstrap version. Specifically, the input text color doesn’t change to white, even though the same code works in the standard Stripe form.

    I’d prefer to use the Bootstrap layout since the default Stripe form is difficult to style to match my website’s UI. Interestingly, other Stripe payment plugins seem to inherit the website’s styles for the iframe input fields, while yours appears to have predefined styles (font, colors, etc.) that override them.

    Is there a way to apply custom styles to the iframe input fields in the Bootstrap version?

Viewing 2 replies - 1 through 2 (of 2 total)