Hi @marpegue,
Normally, you can add CSS via the customizer under Appearance > Customize > Additional CSS. Can you tell us a bit more about what exactly you want to change via CSS? Could you take a screenshot so we can further check and provide you with guidance?
You may want to use https://snipboard.io – please follow the instructions on that page, then paste the URL in this thread.
Thanks, I didn’t know how to share images haha
https://snipboard.io/5J0Nym.jpg
The styles in this section are always overwritten for me. I have tried to add it in Appearance, in the styles of the child theme and nothing …
I would try following this guide to customizing the styling of the Stripe plugin:
https://woocommerce.com/document/stripe-styling-fields/
Let us know if you get stuck there, and where, and we can lend a hand if need be.
Thanks! 🙂
Thank you very much but I already tried to follow all those steps.
I don’t know why but with the wc_stripe_elements_styling PHP filter it still doesn’t catch the styles 🙁
@marpegue
I see you marked the CC part of the screenshot, can you clarify what you’re trying to modify there so we can provide proper guidance.
An iframe is created with styles inside that I can’t overwrite.
https://snipboard.io/B9vGdr.jpg
I want to modify above all the typography. Now it is not consistent with the rest of the web.
Hey @marpegue,
You can’t really apply CSS to the HTML that is loaded within an iframe, unless you have full control over the page loaded in the iframe due to resource restrictions.
Here is an excerpt of the document earlier shared by adamkheckler:
Link to image: https://i.imgur.com/JBXIbbf.png
* https://woocommerce.com/document/stripe-styling-fields/
Let us know if you have more questions.
Hello,
Does that mean that if I follow the instructions on the page and the styles don’t change, then I won’t be able to modify them?
For if it’s helpful, I’ve looked for the ‘wc-stripe-elements-field’ and ‘stripe-card-element’ tags on the page and they don’t show up, maybe I should use another php filter…
I use the plugins:
WooCommerce Payments Version 3.2.3
WooCommerce Stripe Gateway
Version 5.7.0
Plugin Support
con
(@conschneider)
Engineer
Hi again,
Does that mean that if I follow the instructions on the page and the styles don’t change, then I won’t be able to modify them?
I am afraid that is 100% – correct.
When you said “An iframe is created with styles inside that I can’t overwrite.” you hit the nail on the head. The nature of an iframe is that it cannot be touched by the local assets. It is impossible to modify with local custom CSS. Your custom CSS would have to be loaded by the same site that provides the iframe.
Only the checkout of WooCommerce Stripe Gateway – Version 5.7.0 can be customised. The checkout fields added by WooCommerce Payments Version 3.2.3 cannot be edited with any custom CSS.
Kind regards,
I do not understand :'(
I have disabled ‘WooCommerce Payments’ and still cannot edit it. It is on the first website that it happens to me. Can’t I do anything like download an older version?
Thank you all for your responses.
Hello @marpegue,
As mentioned earlier, just WooCommerce Stripe Gateway – Version 5.7.0 can be customized.
It is impossible to modify an iframe with local custom CSS. Your custom CSS would have to be loaded by the same site that provides the iframe.
