Woocommerce Checkout Block

Overview

Inline verification lets a customer entering their email in the Checkout Block request a verification code directly on the checkout page (no popup). The customer enters the code in an inline input; when verified the Place order button becomes enabled. This prevents fraud and reduces failed orders caused by wrong emails.

User flow (what the customer experiences)

1. Customer opens Checkout page and enters an email in the Contact information email field.
2. A “Send verification code” button appears (or becomes enabled) near the email field.
3. Customer clicks Send verification code → email with 4-digit Or 6-digit code is sent.
4. An inline “Verification code” input appears beneath email, with a Verify button and a resend countdown timer.
5. Customer enters the code and clicks Verify.

1. On success:
   • Enable the Place order button (and remove the warning “Please verify your email to enable the Place Order button.”).
   • Show success message (e.g. green tick, “Email verified successfully”).
   • Persist verification state server-side for the checkout session.