Stripe Form Styling

Hi @dazzerr

Which of the credit card forms are you using? The answer on how to customize the form styling is dependent on the form you’re using.

Kind Regards

Just the regular stripe debit/credit card payment ones?

Here’s a link to which I’m referring to: https://imgur.com/PWx2Z0X

Also how do I remove the card images where the arrow is pointing?

Thanks!

• This reply was modified 1 year, 1 month ago by King Ding.

Also how do I remove the card images where the arrow is pointing?

Stripe doesn’t currently have a way to remove the card icons in the Stripe payment form. If you don’t want card icons I would recommend the Stripe inline form.

Here is an example of how you can customize the Stripe payment form:

add_filter('wc_stripe_get_element_options', function($options, $gateway){
	if($gateway->id === 'stripe_cc'){
		$options['appearance']['rules'] = [
			'.Input' => [
				'padding' => '20px'
			],
			'.Label' => [
				'textTransform' => 'uppercase'
			]
		];
	}
	return $options;
}, 10, 2);

Here is a helpful document on the available CSS rules you can include in the filter.

Kind Regards

Thank you, this is very helpful!