How to show loading icon on Add to Cart Button

Are you referring to the shop page? If so, WooCommerce by default already does show a loading status. So perhaps your theme is removing it.

Hey @royho,

Thanks for reply. You can see in here: https://goo.gl/5plnJq .

You can click “Sat?n Al” button for test.

I have also using One page checkout plugin.

Then you would need to add custom JS to pull this off. You can try the following:

jQuery( '.single_add_to_cart_button' ).click( function() {
     jQuery( this ).addClass( 'loading' );
});

You can use a plugin like this to add the script https://www.ads-software.com/plugins/custom-css-js-php/

@royho,

It didn’t work. I’ve added to header.php between head tag. You can see from source-code.

My code snippet like this:
<script type=”text/javascript”>jQuery( ‘.single_add_to_cart_button’ ).click( function() {
jQuery( this ).addClass( ‘loading’ );
});</script>

Try that.

jQuery( document ).ready( function( $ ) {
    $( '.single_add_to_cart_button' ).click( function() {
          $( this ).addClass( 'loading' );
     });
});

To be honest, looking at your site, I believe this “slow loading” is an underlaying problem which should be addressed rather than using a “band aid”. I constantly see 500 server error on some of your assets while loading pages.

I would suggest you fix that.

Also the code you copied is missing a closing parenthesis and semicolon.

Horray! Working now. Thanks for your help mate ^_^