Design payment module of woocomerce
-
Hi Armin,
I have an integration concerning the payment module of woocomerce with Lay Theme, since some time the design is a bit chaotic and looks like this on the payment page of the shop.
Do you know if it is possible to reduce the size of the typography and make all the card number information blocks align correctly?
Thank you very much.
Antoine -
i see!
can you send your website address, /wp-admin/ username and password and a link to this topic to info@laytheme.com?
-
Hi Armin,
Super thanks for your message.
I've sent you all the information on your email info@laytheme.com.Have a nice day.
Antoine -
thanks antoine, haven't found the time yet to take a look but hope to do so soon
-
Unfortunately the plugin WooPayments creates an iframe which actually is a stripe web element:
https://stripe.com/docs/payments/elementsSince its an iframe, there is no way to style it using CSS on Lay Theme's website or in the theme files themselves.
Looking at these docs
https://stripe.com/docs/js/appendix/styleI can see the style is created using javascript.
The WooCommerce Payments plugin doesn't have any settings to change this.There have been many requests for them to provide settings for style:
https://woo.com/feature-request/style-credit-card-fields/
https://github.com/Automattic/woocommerce-payments/issues/3604There is nothing I can do here. I'd advise you to use a different payment plugin for WooCommerce that looks better.
-
Hi Armin,
Thank you very much for your quick feedback and your help!
I've read all the links and information. I understand now.
What do you advise me to use as a payment platform for woocomerce for example?I found this Mollie module that seems pretty good.
https://fr.wordpress.org/plugins/mollie-payments-for-woocommerce/#installationThanks a lot.
Antoine -
actually i don't know which one to use, you could just try some and see which one you like most
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it