Support » Plugin: WooCommerce » CSS omitted

  • Resolved marpegue

    (@marpegue)


    Hello,
    I don’t know where to put the CSS code to modify the styles of the credit card payment method.
    I put it where I put it is overwritten by other styles…
    Thanks greetings.

    The page I need help with: [log in to see the link]

Viewing 12 replies - 1 through 12 (of 12 total)
  • Plugin Support Mirko P.

    (@rainfallnixfig)

    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.

    Thread Starter marpegue

    (@marpegue)

    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 …

    Plugin Support Adam a11n

    (@adamkheckler)

    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! πŸ™‚

    Thread Starter marpegue

    (@marpegue)

    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 πŸ™

    Plugin Support Oyadeyi A. a11n

    (@oaoyadeyi)

    @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.

    Thread Starter marpegue

    (@marpegue)

    An iframe is created with styles inside that I can’t overwrite.

    https://snipboard.io/B9vGdr.jpg

    Thread Starter marpegue

    (@marpegue)

    I want to modify above all the typography. Now it is not consistent with the rest of the web.

    Plugin Support Mirko P.

    (@rainfallnixfig)

    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.

    Thread Starter marpegue

    (@marpegue)

    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 a11n

    (@conschneider)

    Automattic Happiness 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,

    Thread Starter marpegue

    (@marpegue)

    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.

    Plugin Support Chris Moreira – a11n

    (@chrism245)

    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.

Viewing 12 replies - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.