Credit card Fields

Hi there!

Thank you for bringing this to our attention. I checked your site and I can see that there is a JavaScript error in the console, and I can also see that the card fields appear on the checkout page, but nothing can be entered into them. I suspect this could be a plugin conflict.

Could you please run a conflict test by deactivating all plugins except WooCommerce and WooPayments, and then check if you still face the same issue?

You can create a staging site using the following plugin: https://wordpress.org/plugins/wp-staging/ so that your live site remains unaffected.

If the issue persists, I’d like to understand your site properly. Please share with us the necessary information below for us to investigate the issue further:

• System Status Report which you can find via WooCommerce > Status
• Fatal error logs (if any) under WooCommerce > Status > Logs.

Please use https://pastebin.com/ or https://gist.github.com/ and share a link to that paste in reply here. Once we have more information, we’ll be able to assist you further.

Hi @monannivert,

Thanks so much for sharing the additional details and for already running a plugin conflict test. That’s a huge help in narrowing things down.

Based on your error logs and system report, it looks like the issue with the invisible credit card numbers is most likely caused by a combination of CSS styling and JavaScript scripts conflicts, rather than the fatal error itself. Even though you noticed the fatal error after the card field issue, the timing suggests it’s not the root cause.

Side note: The fatal error is pointing to the Broken Link Checker plugin, specifically a missing class in its cross-sell module. You might want to deactivate that plugin for now or reach out to their support team to resolve the error cleanly.

For next steps

1. You’re currently using a custom child theme based on Neve (neve-child). Child themes often override styles, and it’s very possible that the font-size: 0px is being set there. Try switching first to the parent Neve theme, and then to a default theme like Storefront. This will help determine if the issue is theme-related.
2. WooPayments logging is currently disabled. Turning it on will help capture any errors during the rendering of the card fields and give more insight into what’s going wrong.

Let us know how it goes. Looking forward to your update.

Hi @monannivert,

Thank you for getting back to us and I totally understand your concerns about changing the theme.

Unfortunately we won’t be able to troubleshoot this further without running a conflict test. If you’d prefer not to do this on your live site, please create a staging site and switch the theme to Storefront, then deactivate all plugins except for WooCommerce and WooPayments.

You can set up a staging site by copying your live site to a subdomain or directory, or by using the staging feature available in cPanel or through your hosting provider.

Once that’s done, kindly share the staging site link along with the system status report from that site.

Thanks so much for the update, @monannivert,

And great job on the workaround! It’s really interesting that switching to the Neve theme and back to your child theme resolved the issue, even with your custom CSS restored. Sometimes theme resets can clear out lingering style conflicts, so that may have done the trick.

I’ll go ahead and mark this thread as resolved. If you found our support helpful, we’d be truly grateful if you could leave us a quick review here: https://wordpress.org/support/plugin/woocommerce-payments/reviews/.

It helps us continue improving and supporting users like you. 😊