How to Fix WooCommerce Checkout Button Not Working

WP Tech Team
Administrator
252
Posts
0
Fans
Support & TroubleshootingComments57Characters 2101Views7min0sRead
There is nothing more frustrating for an e-commerce store owner than a broken checkout page. If your customers click “Place Order” or “Proceed to Checkout” and nothing happens — or the button spins endlessly without processing — you lose revenue with every wasted click.
In 2026, as WooCommerce continues its full transition to block-based checkout, this issue has become increasingly common. The problem is almost never a broken button itself; it is usually a hidden JavaScript error, a blocked REST API endpoint, over-aggressive caching, or a payment gateway script that fails to load.
This guide walks you through exact, technical troubleshooting steps to identify the root cause and fix your unresponsive checkout button quickly.

Table of Contents

  • Quick Pre-Checks (30-Second Diagnosis)
  • Step 1: Diagnose JavaScript Errors via Browser Console
  • Step 2: Fix WooCommerce REST API & AJAX Blockages
  • Step 3: Resolve Caching & Performance Optimization Conflicts
  • Step 4: Fix Payment Gateway & Nonce Failures
  • Step 5: Resolve Theme & jQuery Compatibility Issues
  • Frequently Asked Questions
  • Still Not Working? Next Steps
  • Final Thoughts

Quick Pre-Checks (30-Second Diagnosis)

Before diving into advanced troubleshooting, run these fast checks to narrow down the issue immediately:
  1. Incognito guest test – Open the checkout page in a private/incognito window as a guest user, not while logged in as an administrator. Admin accounts bypass many caching, security, and nonce checks, so your results will not match real customer experience. If the button works in incognito, the problem is almost always caching or a logged-in session conflict.
  2. Check for a grayed-out button – If the button is completely greyed out and unclickable:
    • Confirm at least one payment gateway is enabled in WooCommerce → Settings → Payments.
    • Verify a shipping method is available for the entered address (missing shipping options disable the place order button by default).
    • Ensure all required checkout fields have valid input (invalid phone or email formats keep the button disabled in block-based checkouts).
  3. Match your symptom to the right step
    • Button does nothing when clicked → Start with Step 1 (JavaScript errors)
    • Button spins forever but no order is created → Start with Step 2 or Step 3
    • Order is created but stays “Pending payment” forever → Jump to Step 4

Step 1: Diagnose JavaScript Errors via Browser Console

When a checkout button freezes or triggers no action on click, a JavaScript error has almost always crashed the page’s script execution in the background. This is the single most common cause of unresponsive checkout buttons.
How to check:
  1. Go to your store, add a product to the cart, and navigate to the Checkout page.
  2. Right-click anywhere on the page, select Inspect, and switch to the Console tab. (You can also press F12 on most desktop browsers.)
  3. Click the broken checkout button and look for any red error messages.

Common Console Errors & Quick Fixes

  • TypeError: Cannot read property... of undefined

    This is usually caused by an incompatible plugin (such as a multi-step checkout extension or custom checkout field manager) or custom theme code that conflicts with your current WooCommerce or PHP version. Deactivate checkout-related plugins one by one to isolate the culprit. If the error disappears on a default theme, your child theme’s functions.php or custom checkout template needs updating.

  • ReferenceError: wc_checkout_params is not defined

    The most common error from performance optimization tools. WooCommerce’s core checkout script is being delayed, deferred, or loaded out of order. Skip to Step 3 for the JavaScript optimization fix.

  • 403 Forbidden, 404 Not Found, or 500 Internal Server Error referencing /wp-json/wc/v3/ or /wp-json/wc/store/

    Your site’s REST API endpoints are being blocked by a security plugin, firewall, or broken rewrite rules. Proceed to Step 2.

  • Mixed Content errors

    Your checkout loads over HTTPS but some scripts or assets are loaded over HTTP. Fix this by updating your Site URL and WordPress Address to HTTPS in Settings → General, and run a database search-replace if needed to update old HTTP URLs.

Step 2: Fix WooCommerce REST API & AJAX Blockages

Modern WooCommerce checkouts — both classic shortcode and block-based — rely entirely on the WordPress REST API and AJAX requests (admin-ajax.php and wc-ajax) to validate fields, load payment methods, and process orders without a page refresh. If a security plugin, hosting firewall, or CDN blocks these endpoints, the checkout button will stop functioning.

Quick Fix for REST API 404 Errors

Most broken REST API issues can be fixed in 10 seconds with no technical changes:
  1. Go to WordPress Dashboard → Settings → Permalinks.
  2. Click Save Changes without modifying any settings.
This flushes WordPress rewrite rules and resolves the majority of REST API 404 errors instantly.

1. Check Security Plugin Over-Optimization

Plugins like Wordfence, Solid Security, or Sucuri sometimes restrict REST API access to block scraping and attacks.
  1. Open your security plugin settings.
  2. Disable “Restrict WordPress REST API Access” for standard WooCommerce routes, or add the following namespaces to your allowlist:
    • /wp-json/wc/v2/*
    • /wp-json/wc/v3/*
    • /wp-json/wc/store/*

2. Fix Cloudflare WAF False Positives

If you use Cloudflare, its Web Application Firewall (WAF) may flag rapid checkout actions as bot traffic and block critical requests.
  1. Log in to your Cloudflare Dashboard → Security → Events.
  2. Look for blocked requests containing /wp-json/, admin-ajax.php, or wc-ajax.
  3. Create a WAF bypass rule for the checkout flow:
    • Rule name: Bypass WooCommerce Checkout
    • Field: URI Path
    • Operator: contains
    • Value: /checkout
    • Action: Skip → All WAF managed rules, Rate limiting, Bot Fight Mode
  4. For full reliability, also create a Cache Rule to bypass edge caching for /checkout/*, /cart/*, and /my-account/* paths.

Step 3: Resolve Caching & Performance Optimization Conflicts

Caching and speed optimization plugins are critical for store performance, but dynamic pages like Cart, Checkout, and My Account must never be cached or have their scripts modified. Stale security tokens (nonces) and delayed scripts are top causes of broken checkout buttons.

1. Exclude Dynamic Pages from Page Caching

If your checkout page is cached, expired nonces will make the button completely unresponsive.
  1. Open your caching plugin settings (WP Rocket, LiteSpeed Cache, FlyingPress, etc.).
  2. Navigate to Never Cache URLs or Excluded Pages.
  3. Add these paths to the exclusion list:
    • /cart/
    • /checkout/
    • /my-account/
    • /wp-json/wc/store/
  4. If your plugin supports query parameter exclusions, add wc-ajax to the “Never Cache GET Parameters” list to ensure AJAX responses are never cached.
  5. Purge all cache and test the checkout in an incognito window.

2. Exclude Checkout from JavaScript Optimization

This is the most overlooked — and most common — cause of checkout failures in 2026. Features like Delay JavaScript Execution, JS minification, and script combining often break WooCommerce’s checkout flow even when page caching is correctly excluded.
If you see wc_checkout_params is not defined in the console, this is your fix:
  1. Open your speed/optimization plugin settings.
  2. Find the Delay JavaScript, Defer JS, or JS Combine section.
  3. Add the following scripts and keywords to the exclusion list:
    • wc-checkout.js
    • wc-cart.js
    • wc-checkout
    • Stripe and PayPal gateway script handles
    • /wp-content/plugins/woocommerce/assets/js/frontend/
  4. Save settings, purge all cache, and retest.

Step 4: Fix Payment Gateway & Nonce Failures

If the button spins endlessly but never submits, or if orders are created but permanently stuck in “Pending payment”, your payment gateway is failing to initialize or communicate with your site.

Important First Step: Clear WooCommerce Sessions & Transients

Corrupted session data in your database can break checkout nonces and cause silent failures.
  1. Go to WooCommerce → Status → Tools.
  2. Click Clear WooCommerce transients.
  3. Click Clear customer sessions.
⚠️ Caution: Clearing customer sessions will empty all active shopping carts and log all customers out of their accounts. Only perform this during low-traffic hours, and consider posting a brief site maintenance banner beforehand.
If you use object caching (Redis, Memcached), flush your object cache entirely after clearing transients for the most reliable results.

Stripe (Official WooCommerce Stripe Gateway)

A frozen checkout button is almost never caused by a missing webhook. Webhooks handle asynchronous server-to-server payment notifications — they update order status after payment, but do not control the frontend button. A spinning or unresponsive button is almost always a frontend script issue.
  1. Console check: Look for errors mentioning stripe.js, wc-stripe, or blocked requests to https://api.stripe.com. If Stripe scripts are blocked by a Content Security Policy, ad blocker, or cookie consent plugin, the button will fail silently.
  2. Verify API keys: Go to WooCommerce → Settings → Payments → Stripe. Confirm your Live Publishable Key and Live Secret Key exactly match the values in your Stripe Dashboard. A key mismatch will fail with no visible error message.
  3. Webhook verification (for Pending payment orders): If orders are created but never update status, check your webhook configuration. In your Stripe Dashboard → Developers → Webhooks, confirm the endpoint URL (e.g., https://yourdomain.com/wp-json/wc/v3/webhooks) is correctly configured and the Signing Secret matches the Webhook Secret in your WooCommerce settings.
  4. Block checkout tip: Temporarily disable express payment buttons (Apple Pay / Google Pay) in the Stripe plugin settings. Misconfigured express buttons can interrupt the main checkout button’s JavaScript execution.

PayPal

  1. Console check: Look for blocked requests to https://www.paypal.com/sdk/js or errors referencing smart-payment-buttons. PayPal’s SDK being blocked by an ad blocker, CSP, or cookie plugin will break the checkout button completely.
  2. Verify credentials: Confirm your PayPal Client ID and Secret are valid for the live environment (not sandbox). Test in sandbox mode to rule out credential issues.
  3. Use the official plugin: For block-based checkouts, older third-party PayPal plugins frequently break. Switch to the official WooCommerce PayPal Payments extension, which fully supports Cart and Checkout blocks.

Cookie Consent / GDPR Plugin Note

If you use a GDPR cookie consent plugin, ensure Stripe, PayPal, and core WooCommerce checkout scripts are marked as essential or allowed before user consent. If payment scripts are blocked until consent is given, the checkout button will not work for new visitors.

Step 5: Resolve Theme & jQuery Compatibility Issues

If you have tried all the steps above and the button still does not work, your active theme may be loading an outdated version of jQuery, missing critical WooCommerce hooks, or using an overridden checkout template that is no longer compatible.
Run a standard conflict test:
  1. Temporarily switch your site’s active theme to the official Storefront theme or the latest default WordPress Twenty theme.
  2. Test the checkout button in an incognito window.
  3. If the button starts working immediately, your premium theme’s custom checkout template is outdated. You will need to update the theme to the latest version, or contact the theme developer to patch their form-checkout.php and block template overrides.

How to Fix WooCommerce Checkout Button Not Working

Frequently Asked Questions

Why is my WooCommerce place order button not working?

The most common causes are JavaScript errors from conflicting plugins, cached checkout pages, delayed checkout scripts, blocked REST API endpoints, or payment gateway script failures. Start by checking the browser console for red error messages to narrow down the root cause.

Why is my WooCommerce checkout button greyed out?

A greyed out, unclickable checkout button typically means no payment gateway is enabled, no shipping method is available for the entered address, or required checkout fields are incomplete. In rare cases, it can also be caused by a JavaScript error that breaks form validation.

Can caching plugins break the WooCommerce checkout?

Yes — both page caching and JavaScript optimization can break the checkout. If cart, checkout, or my-account pages are cached, expired WordPress nonces will make the button unresponsive. You must always exclude dynamic WooCommerce pages from page caching and script modification features.

Why does my checkout work for me but not for customers?

This almost always happens when you test while logged in as a WordPress administrator. Admin sessions bypass caching, nonce expiration, and many security rules. Always test in a private browsing window as a guest user to replicate real customer behavior.

Still Not Working? Next Steps

If you have followed every step and the checkout button still fails, try these advanced troubleshooting steps:
  1. Enable WordPress debug logging and check your site’s debug.log for PHP fatal errors during checkout.
  2. Review your hosting error logs for server-side timeouts or memory limit errors.
  3. Reach out to your payment gateway’s support team with screenshots of your browser console errors.
  4. If you experience random failures during peak traffic, you may be hitting PHP worker limits or database performance bottlenecks.

Final Thoughts

A smooth, reliable checkout process depends on fast, unblocked server responses and properly loaded frontend scripts. Slow database performance, limited PHP workers, and over-restrictive security rules will all cause random checkout timeouts — especially during high-traffic periods.
For long-term reliability, ensure your hosting environment includes dedicated object caching (Redis / Memcached), uncached database connections, and enough PHP workers to handle concurrent checkout requests. A properly optimized WooCommerce stack keeps your checkout button fast, responsive, and dependable for every customer.
Did this guide help resolve your broken checkout page? Let us know

 
WP Tech Team
  • by Published onJuly 7, 2026
  • Please be sure to keep the original link when reposting.：https://www.wptroubleshoot.com/woocommerce-checkout-button-not-working/

Loading...

Comment