How to add loader or spinner during WooCommerce Checkout

How to add loader or spinner during WooCommerce Checkout

wpdevcodes
January 29, 2019June 23, 2022
0

When an individual taps the Place Order catch, the page blurs to a straightforward white while installment is being submitted. Due to outside constraints of people, for example, web availability, this page may sit for some time and guests are inclined to hit the back or invigorate catch which causes twofold installment at times.

Basically, using CSS we can easily manage the things and it will affect on the checkout page. When user click on “place order” button the loader will be appear in the middle of the page. It will works through Ajax.

Put the below CSS code into the css file:

.processing .blockOverlay {
    background-image:url('/images/loader.gif') !important;
    background-position: center 30% !important;
    background-repeat: no-repeat !important;
}