Please note that the snippet in this post applied to the WooCommerce Stripe extension before version 4.0 was released. If you are on version 4.x.x (or greater) this may not work for you!
If you use the WooCommerce payment Gateway Stripe – and why wouldn’t you, it rocks rocks rocks! – and your currency is set to USD, you’ll notice that, as well as the common old Visa, Mastercard and American Express logo icons, you also see the not-quite-so-common Diners, JCB and Discover cards.
On a recent project, the size of the checkout was really important to our client, who wanted to lose JCB and Diners cards in order to keep the payment logos “on one line” when it came to narrower displays, like a mobile held vertically, for example.
So we added some code to make this happen, using the WooCommerce filter
When I wrote this little snippet, I found that the docs and tutorials out there were not so helpful and not so great. So I thought I’d give you all something back (Open Source. Woop.) with a snippet which describes how to get a superfluous payment service icon gone for good from your Stripe checkout!
How to Remove Obscure Payment Logos (Icons) from WooCommerce Stripe Gateway
Add the following snippet to your themes functions.php or a helper plugin:
Now, please note, that you should replace the entire URL of the icon image in question, which you can find by right clicking like this:
Also it should be noted that the svg ending and the “style…” part will not be there for WooCommerce versions before 2.6. If you have WooCommerce version earlier than 2.6, then please update. Just update. But also note, the above snippet will. Not. Work!
Leave a comment below if this helped make your day, just a little bit, easier.