How To Show The Woocommerce Checkout Errors On Mobile

Viewed 12

I am running into some issues on the mobile version of our checkout page. Customers that try to place an order and don't fill out everything correctly don't get shown an error message.

I'm using the DIVI block builder but that shouldn't be an issue.

Here is the error message that is shown on desktop sites.

Desktop Error

But on mobile, all that happens is the text turns red for the checkmarks.

Somehow customers can't seem to figure out what is going on so I would like to print out an error message at the top of the page that shows the issues as is done with the desktop version.

For the page - https://thefarmdream.com/checkout/ (will only work if you have items in your basket)

1 Answers

I figured out what the issue was after a few days of searching.

Since I use the Divi builder and wanted a different layout on mobile vs desktop I used the DIVI "woo checkout payment settings" block twice on the page.

The error messages can only be shown once, so it was showing on the desktop but not on the mobile version.

Removing the second block and changing the layout a bit fixed everything!

Related