Hi,
I have a question: when navigating to the checkout page, the preloader does not appear. At the same time, when navigating to other pages, it works without any problems.
I even tried writing a custom preloader that should react to a GET /checkout request, but it still doesn’t show up.
The checkout page has many WooCommerce and payment system integrations Stripe, so it loads a bit slower than other pages. It would be great if the preloader was displayed there as well.
I couldn’t find a similar issue on the forum.
Could you please advise how this can be solved?
Could you please clarify what you mean by loader in this case? If you are referring to the loading icon and the white screen that appears before a page is fully loaded, then yes — this is integrated into all pages via HTML. However, the issue may be that WooCommerce is overriding it.
When clicking, for example, on “Promote Job/Vacancy” or “Advertise Listing,” a GET request is sent to feature and checkout. The request is triggered and loading begins, but the page has not yet rendered. At this stage, the preloader (as shown in the screenshot) is not displayed, which is unusual, and I haven’t been able to trace why this is happening.
Do you think WooCommerce is actually overriding it even before the page starts rendering, and would it be sufficient to add the preloader directly into the checkout page’s HTML?
Installed plugins:
WooCommerce
WooCommerce Stripe Gateway
Edit Checkout for WooCommerce
Loco Translate
LiteSpeed Cache
The problem is most likely that the checkout page does not render immediately, and at that moment there is no preloader, but when the page starts rendering, the preloader appears.
The problem is most likely with the performance of the checkout page: the requests are being sent, but the page hasn’t rendered yet, and at that moment there is no loader. When the page starts rendering, the loader appears.
I’ll try to work on the performance so that the page renders immediately.
Please clarify the condition which way the call (click) to the checkout page is done cq established. Are these “Promote Job/Vacancy” or “Advertise Listing,” custom implementations?
For example the native situation when clicking the Buy Now button is, it will trigger the data-state=“loading” on the clicked submit button, and thus render a small spinner inside the button, and via Ajax submits a form and when done with the request it redirects to the checkout page which triggers the “global” spinner.
If your implementation is different perhaps this explains it. You might be taking all in one step, while the native hivepress does it in 2 steps (submit → redirect). The time wait is the same but the experience is different.
Hi,
For example, when clicking on Promote Job/Vacancy (the star icon) in Neework, two GET requests are sent:
/feature and /checkout
However, the checkout page doesn’t render immediately, and during this time there is no loader displayed.
The built-in theme preloader is pretty simple, it’s not linked to GET requests – the icon itself is added as HTML to the current page content and when the page is fully loaded, it’s hidden with JS hivetheme/assets/js/frontend.js at master · hivepress/hivetheme · GitHub I assume that WooCommerce loads the whole checkout page via AJAX and shows it’s own preloader, but the page itself is empty by default so the default preloader is hidden very quickly.