Disable Proceed to Checkout button

Hey @rdc4 !

I can’t say how you’ve added the conditions to make sure the button can’t be used, but I assume you’re using some custom code for that.

Do you have a link to your site so we can take a look how the Cart button is disabled?

I haven’t added anything, it comes with Woocommerce, as you can see here on this Woocommerce demo store: https://themes.woocommerce.com/storefront/cart/

It’s through the aria-disabled feature.

• This reply was modified 4 years, 7 months ago by kraky9.

Apologies, perhaps I misunderstood. I was referring to this part:

> so far I’ve been able to simply remove the Proceed to Checkout button,

From that, I was wondering how you’ve done that? Do you mean that you’re editing code to remove the button in specific situations?

I simply used: remove_action( ‘woocommerce_proceed_to_checkout’,’woocommerce_button_proceed_to_checkout’, 20);

Hey there!

This would require some JavaScript written for your site, which is a bit outside of the specialty of most of us here.

This is a fairly complex development topic. I’m going to leave it open for a bit to see if anyone is able to chime in to help you out.

I can also recommend the following places for more development-oriented questions:

1. WooCommerce Slack Community: https://woocommerce.com/community-slack/
2. WooCommerce FB group: https://www.facebook.com/groups/advanced.woocommerce/

Hi @rdc4!

One thing you could also do here, to disable the button is to use some CSS and set a pointer-events: none;

Using the Storefront theme as an example, this is the code that works:

.hentry .entry-content a.button, .hentry .entry-content a.components-button:not(.is-link), .hentry .entry-content a.wp-block-button__link {
    pointer-events: none;
}

Would that help?

Cheers!

Hi,

Thank you for the response.

Yes that would work, but how would I add the css code for the button inside a function in the functions.php?

Thank you

Hi @rdc4 ,

CSS code doesn’t need to be in your functions.php. You can use the “Additional CSS” tab in the Customizer.