Stripe checkout fields background colour

Still an issue with 7.3.0. The link mariasangria provided holds the solution for the fix within the page’s documentation. To summarize the fix:

• Go to Appearance > Theme File Editor.
• Click on functions.php under Theme Files.
• Scroll to bottom of the file and above the last line with ?> on it, paste in:

add_filter( 'wcpay_upe_appearance', function ( $appearance ) {
	unset( $appearance->rules->{'.Input'} );
	$appearance->rules->{'.Input'} = [
		'colorText' => 'white',
	];

	return $appearance;
} );

• Click Update File to save.
• Change to a different theme and then change back to clear transients.

Your credit card fields should no longer be the unreadable black and now good to go.

Hello, I’m getting exact same issue no difference, here is what I tried:
added this code using code snippets:

add_filter( ‘wcpay_upe_appearance’, function ( $appearance ) {
// Ensure rules property is an object and remove existing .Label rule
if (isset($appearance->rules) && is_object($appearance->rules)) {
unset($appearance->rules->{‘.Label’});

    // Add the new .Label rule with a black color
    $appearance->rules->{'.Label'} = [
        'color' => '#000000', // Use the actual color code
    ];
}

return $appearance;

} );

tried this code aswell didn’t work:
add_filter( ‘wcpay_upe_appearance’, function ( $appearance ) { unset( $appearance->rules->{‘.Input’} ); $appearance->rules->{‘.Input’} = [ ‘colorText’ => ‘white’, ]; return $appearance; } );

Link to website: https://airporttransferfalkirk.co.uk/
screenshot: https://imgur.com/a/3AYIL4g
Please help me solve it as well. Thank you

Hello scotlandtravel

Thank you for contacting Woo support.

Could you share a screenshot of the code you have added via the Code Snippets plugin?
Please share a full-page screenshot so I can also check the options under the code.

To confirm, which version of the WooPayments plugin are you using?

I will be happy to help you further once I have more information. ??

Best regards.

Neverminded, I just received new update and it will fixed this issue thanks.

Hi @scotlandtravel,

Glad to hear it – thanks for letting us know!

I’m replying just to subscribe to future updates because no-one solution found on these pages works for me.
Everyone link these pages:
https://woocommerce.com/document/stripe/customization/style-payment-form/
https://woocommerce.com/document/woopayments/customization-and-translation/customize-payments-appearance/

No changes appear to me, no matter what I did.
Clear transient via the code below broke the site:
delete_transient( 'wcpay_upe_appearance' );
delete_transient( 'wcpay_wc_blocks_upe_appearance' );

Is’t easier and less time-consume for everyone to post an how-to video?

Folks just asking for 3 simple options:

• font color
• fields background
• fields borders

I suppose these things are easier then collecting payments all over the world in different currencies, from different methods ??
Please help lot of wp developer!

Hi @frensis,

I understand you’re experiencing issues with customizing your payment form and that sometimes written instructions may not be as clear as a visual guide.

In the meantime, I’d like to help you with your current issue. The links you’ve provided are indeed the correct resources for customizing the appearance of your payment form.

As this thread has already been marked as resolved, it means there will be no updates on the issue, therefore, I recommend creating a new topic for further assistance. Here’s a direct link to creating a new topic.

Looking forward to assisting you further there.

Thank you for understanding.