Remove credit card icons
-
I was forced to enable the new checkout experience in order to disable “Link” payments, but now the card number field has credit card icons in it. How can I remove these?
Thanks in advance.
-
Hi @stylise
Unfortunately, there is no built-in option to remove the card icon. However, you might achieve it using custom CSS or code snippets:
- https://woocommerce.com/document/stripe/customization/payment-icons/
- https://woocommerce.com/document/stripe/customization/style-payment-form/
Please note that writing or providing custom code is not within the scope of our support policy. If you are still having problems, we recommend asking development questions on the #developers channel of the WooCommerce Community Slack. Many of our developers hang out there and will be able to offer insights into your question. You can also seek help from the following:
- A local web developer
- Codeable.io
- WooExperts
I wish I could help more, but hopefully, this gets you going in the right direction to get the job done.
@shameemreza Thanks for the details. I didn’t realize that the plugin hosted on WooCommerce is the same one listed here on WordPress.
Does the payment icons customization (https://woocommerce.com/document/stripe/customization/payment-icons/) still work with the non-legacy version? It doesn’t seem to have any effect for me.
Hello stylise
Thank you for your reply.
The documentation link share is for the legacy version.
It does not work with the newer version.You could use CSS code to hide the icons.
Here is a CSS snippet that you can put in the Additional CSS of your theme..p-CardIcons {
display: none !important;
}It will hide the card icons.
Let me know how it goes. ??
Best regards.
@doublezed2 Thanks for the advice.
.p-CardIcons is housed inside of an iframe, so it’s not addressable. Any other suggestions?
Hey, @stylise!
As mentioned, you can achieve that with custom code, but this is out of our support policy, so we are not able to assist you further with that.
We recommend asking development questions on the #developers channel of the?WooCommerce Community Slack. Many of our developers hang out there and will be able to offer insights into your question. You can also seek help from the following:
- A local web developer
- Codeable.io
- WooExperts
Please let us know if there’s anything else we can do to help or if you have any questions.
Have a wonderful day!
@carolm29 So you are confirming that it is possible with custom code even though the form is hosted in an iframe?
Hi @stylise
Customizing the payment forms used in the Stripe WooCommerce Extension is a bit different than styling other elements of your site. This is because the payment form is served in an?
iframe
?on your site — which means that the payment form is actually hosted by Stripe, and it’s embedded on your site.You can style some of the payment form using custom CSS, you may also need to leverage custom PHP in order to achieve your goal.
With regard to removing the credit card icons, feel free to reach out to Stripe’s support channel (linked here), while making sure to include an explanation as to why it is needed in your use case.
I trust that points you in the right direction, but if you have more questions, let us know.
We’re happy to help.
Hi @stylise
We’ve not heard back from you in a while, so I’m marking this thread as resolved. Hopefully, you were able to find a solution to your problem!
If you have further questions, please feel free to open a new topic.
Thanks!
I want to do the same thing that stylise wants to do: hide the credit card icons that display within the input field (where the purchaser will type in their credit card number).
Zubair Zahid’s CSS solution above does not work because the input field is within an iframe.
Since custom CSS coding cannot be used to make this change, the option to hide these icons should be offered as a feature in the plugin itself. Please add this feature to an upcoming update of the plugin.
Hello @alisontaylorbc,
We appreciate your suggestions and are always looking for ways to improve our products and services, and input from users like you is invaluable.
We have a website where you can submit feature requests and upvote the ones other people submitted and you like. You can check that out?here.
If you have additional questions, would you mind?opening up a new thread?for this so that we can keep things organized as per WordPress?forum guidelines and offer more personalized support for you? We’ll be happy to help you out with this over there!
Thanks!
- You must be logged in to reply to this topic.