Add Preloader to Checkout and Add to Cart Buttons

  • Resolved WP-77

    (@admin247365)


    3 years ago

    Hi,

    First, I would like to say this is a fantastic plugin. Where would my business be without it?

    My hosted server is reasonably fast but there is about a 4 second delay when customers click the Add to Cart or Checkout buttons (actually I skip Add to Cart and take customers directly to Checkout). The problem is customers often click the button twice during the 4 second delay between clicking the button and the Checkout Page being displayed. The customer then gets frustrated and has to delete the duplicated item in the cart.

    Your preloader for the Place Order button works great. Can you please add this preloader to the Add to Cart and Checkout buttons?

    Thank you!

    Ron

    • This topic was modified 3 years ago by WP-77.
Viewing 9 replies - 1 through 9 (of 9 total)
  • Mirko P.

    (@rainfallnixfig)

    Hello @admin247365

    Thanks for reaching out on the WooCommerce forums.

    First, I would like to say this is a fantastic plugin. Where would my business be without it?

    That’s great to hear! Thanks for your fantastic review on WooCommerce core.

    there is about a 4 second delay when customers click the Add to Cart or Checkout buttons

    Delays usually happen due to the number of plugins installed on the website and sometimes due to other factors. Does it change if you only run WooCommerce and the default Storefront theme? Do you notice an improvement?

    Your preloader for the Place Order button works great. Can you please add this preloader to the Add to Cart and Checkout buttons?

    You mean the Ajax function, right? You can use plugins for that, for instance https://www.ads-software.com/plugins/woo-ajax-add-to-cart/ allows users to include single products or variable products in the cart without the need to reload the entire site each time. Also, I would like to recommend this article that has detailed information on how to achieve it with custom coding.

    Hope this helps!

    Thread Starter WP-77

    (@admin247365)

    Hi,

    Maybe I should have used the word, ‘Spinner’ instead of ‘Preloader’ for the animated graphic that shows the system is processing.

    I’m not a theme or AJAX issue. I would just like to see the Spinner/Preloader animation during this 4 second delay so customers visually see that the order is processing (otherwise customers think nothing happened after clicking the button and click it again).

    WooCommerce does this (or maybe it’s my credit card gateway plugin) when the Place Order button is clicked. I would just like to see the same when the Add to Cart or Checkout buttons are clicked.

    Thank you,

    Ron

    • This reply was modified 3 years ago by WP-77.
    Mirko P.

    (@rainfallnixfig)

    Hi again,

    Can you share a link to your site so we can take a look at how those buttons work at the moment?

    Also, please send us a copy of your site’s System Status. You can find it via WooCommerce > Status. Select “Get system report” and then “Copy for support”. Once you’ve done that, paste it here in your response.

    Thanks!

    Thread Starter WP-77

    (@admin247365)

    I’m just asking if WooCommerce will ever add a preloader/spinner after the Add to Cart and Checkout button is clicked to show the system is processeing while the next page loads.

    • This reply was modified 3 years ago by WP-77.
    Abiola Ogodo

    (@oaoyadeyi)

    @admin247365

    For this request, I found this guide quite helpful: https://elartica.com/2017/08/03/woocommerce-ajax-add-cart-single-product-page/

    Thread Starter WP-77

    (@admin247365)

    Hi,

    Thanks for the reply but I’m just looking for a preloader/spinner/animation to let customer’s know that the system is processing after clicking the buttons – Add to Cart, Checkout and Place Order.
    Please note that many users do not cache WooCommerce pages for stability.
    See demo preloader in link below.

    https://codepen.io/austinteer/full/xbPWbp

    Could this be an option for WooCommerce?

    • This reply was modified 3 years ago by WP-77.
    Mirko P.

    (@rainfallnixfig)

    Hi @admin247365,

    This is not something that can be done with WooCommerce out of the box, and it would require some customization. In the meantime, you can check out these articles/threads to get started:

    – https://coreysalzano.com/wordpress/spinners-and-loading-animations-built-into-woocommerce/
    – https://wppatrickk.com/woocommerce-add-cart-ajax-single-product-page/
    – https://www.ads-software.com/support/topic/not-seeing-spinner-while-checkout-processes-the-order/

    I can also recommend the WooCommerce Developer Resources Portal for resources on developing for WooCommerce.

    If you do require more help with the actual coding, we’d recommend hiring a developer or one of the customization experts listed at https://woocommerce.com/customizations/.

    Hope this has pointed you in the right direction.

    Thread Starter WP-77

    (@admin247365)

    Thanks for replying but ‘WooCommerce Add to Cart with Ajax on Single Product’ doesn’t address the issue especially since I skip the cart completely and go directly to the checkout page.
    It’s sad to see WooCommerce won’t just add the option. Most eCommerce sites that I have used show an animation while the system is processing.
    Closing request.

    Abiola Ogodo

    (@oaoyadeyi)

    @admin247365

    I’ll mark this thread as resolved now. If you have any further questions, I recommend creating a new thread.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Add Preloader to Checkout and Add to Cart Buttons’ is closed to new replies.