How To Show The Woocommerce Checkout Errors On Mobile - woocommerce

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

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

Product list randomly disappearing in Woocommerce shop page with W3TC

I manage a Wordpress page that had this issue before, but after doing some caching configuration (W3TC) the product list in shop page started disappearing more frequently. The only thing that brings it back is opening the page in page editor and pressing "update", no changes should be made. Purging all cache also does not help (pages are built using DIVI page builder).
So far I have reverted all of the changes that were made before, but that has not decreased the frequency of the issue.
Because of the store being live, I am not inclined to do plugin uninstalls as it can damage the page even more (Issues of page CSS not loading properly were seen before, purging cache helped in that case)
One thing that I thought about is making some kind of script that updates the page automatically as a temporary solution (a new site is going to be made eventually)
What could be done to either troubleshoot this issue in safe way or at least create an automatic page update script?
-WordPress 5.1.1 running Divi theme, Woocommerce version 3.5.7-
You say page "started disappearing more frequently", do you mean page is loaded but content disappears or it whole page does not load?
Try turning off Minifying in W3TC. I had this problem few times and always a problem was typo in CSS.
In W3TC in General Setting there is possibility to enable Preview mode, turn this on always before deploying. Turn on preview mode, check if everything is Ok, test, search for bugs. And only when you are sure that everything works fine then deploy it.
Thank you Vladimir for the tip about preview mode. The bug unfortunately is not in the CSS though because minifying is not enabled in W3TC.
By "disappearing more frequently" I mean Header and Footer being fine and Body being only partly loaded - Broken page screenshot
However, I have tracked down the issue to woocommerce itself. It seems like the default set shop page is the one crashing regularly. I did not find solution to the initial problem, but I found a trick that works, at least for now.
I created a new Shop page, but instead of linking it in Woocommerce settings, I just included a [products] shortcode. The previous page is still active, but not visible to user. Even if the shop page itself crashes, products are still visible and purchases are possible.

Website doesn't load portfolio content on mobile

I just made a website using a Wordpress theme and it all works good on desktop computers. However, while the site initially loads normally on my phone (I'm using iPhone 6 with iOS9, but the problem is the same on Android phones too, I tried two), once I click on the portfolio item, it loads a blank page (header and footer only).
When I tap on the address bar, I notice that it never went to the right link at first place (the portfolio item link), it just shows the homepage link and there is no content.
I managed to fix the problem by entering the external URL in portfolio item options. It was still internal link from the site but I made the link open the new tab (if it doesn't open new tab, the problem stays the same). However, if I choose to go back to the homepage from that link (the portfolio item link), the homepage is blank, there is only header and footer so the problem returns again.
Just so you know, the first portfolio item contains the external link outside the Wordpress and that one opens normally.
What is wrong with the mobile site?
The site URL is: http://svenharambasic.com
The screenshot is attached. Thank you!
P.S. There are also google ads showing, I never encountered that before, but I'll work on that once this is solved.
I only see a white screen upon clicking any of the homepage portfolio image links (except for the first link which goes to an external site in a new tab) on desktop and on mobile actually. There is a content_inner class with inline styling setting visibility:hidden.
It's unclear to me why it's doing that- maybe to remove focus from the body and draw focus towards something that is supposed to appear in the foreground but does not? If I remove visibility:hidden from the element in the browser, I see a series of additional images appear, which seems to me to be more an expected behavior. Are we on the right track?
I managed to solve this, it was the setting in the theme options; I had to disable grid lines... I can't say I truly understand why, but it worked!

Stripe Checkout Overlay - Why Fine on Desktop, Not on Mobile?

I'm installing Stripe Checkout on my site for the first time, through the Simple Stripe Checkout Wordpress plugin. On my test page, the "Pay With Card" button appears just fine, but when I click it, the overlay with payment form only appears on my desktop. On mobile, it clicks through to a Stripe-hosted page, which is not what I want. Anyone who's interested, or can help, can check it out here:
http://www.radionowhere.net/stripe-test/
I've tried this on 3 different blogs, all with the same results. Am I missing something? Thanks! ~ MB
That's just how it works.
Presumably Stripe have decided that mobile devices can't reliably support the overlay, so they launch a new page instead.
You can see it working that way in the demo at https://stripe.com/checkout (and I've just checked my Stripe Checkout, and mine works like this too).
To be honest, I prefer it - on a small screen, on a limited device, it's better to let the checkout take up the whole screen IMHO.

Orchard CMS Confirmation message appears on desktop but not on mobile or tablets. Trying to fix so it works on all

I have a custom form module installed for a contact us page.
When on a desktop the form will give a confirmation message either that your form was accepted or denied. However this is only working on a desktop
I'm trying to figure out whats causing it to stop working on other devices. I have the ResponsiveThemeMachine theme installed but I looked through the css files and saw nothing about the class .message-Information (which is what the confirmation message uses)
I'm not sure where else to look as to why it wouldn't work on anything but a desktop.
I partially solved this if anyone has the same problem. I had to add a widget in the message field so what I did was created an HTML widget and set the title to not appear and left the body blank and set it to only appear on the contact page. It did push the content down a little bit but now my message works on all devices

Products.Carousel stopped working - seems related to plone.app.registry

I have Products.Carousel 2.1b3 installed in my Plone 4.0.2 site. It worked alright up until a day or two ago.
First symptom was that when clicking on the Carousel tab for a folder, it wouldn't show the tabs (only the message above the tabs - the one which says that I should go to Contents tab to edit existing banners).
I deactivated and then reactivated the product in the Plone Control Panel. It seems to have corrected the tabs not appearing problem. After that, however some other strange symptons:
Some Carousels refuse to appear (it seems but I am not sure that the only Carousel appearing is the one for the Plone Site)
The width and height configuration are not respected
For the Carousel that does appear, there is no transition and the slider shows only the first banner
Finally, in the event.log, there is a Warning about plone.app.registry:
2011-04-07T17:45:55 WARNING OFS.Uninstalled Could not import class 'Registry' from module 'plone.app.registry.registry'
But I have no idea whether this started showing before or after the Carousel problems.
Any ideas on how I can fix it?
EDIT --
After some experimentation, it seems to be fixed by removing collective.carousel.
Does anyone know about any incompatibility between Products.Carousel and collective.carousel? Should one NOT install both at the same time in the same site?
Run bin/instance debug It's not uncommon to see errors reported there that you don't see in your normal log.
"Some Carousels refuse to appear" sounds likely to be a script problem - try using Firefox with Firebug to see if there are either any 404 (file not found) errors or javascript errors.
While OFS.Uninstalled is just a warning, I've seen sites completely broken by removing plone.app.registry. However, this isn't the usual symptom. I doubt it's the issue, but you can always add plone.app.registry to your buildout and see if your problems go away.

Resources