Add custom fields to the WooCommerce Block checkout (Store API)
The new WooCommerce Block (Cart & Checkout) checkout breaks many custom-field plugins. Here is how to add checkout fields that render, validate and save on both the Block and classic checkout — with conditional logic, free.
If you switched your store to the new WooCommerce Block (Cart & Checkout) checkout and your custom fields disappeared, you are not doing anything wrong. Most older field plugins were written for the classic shortcode checkout, and the Block checkout is a different beast — so the fields silently stop rendering, stop validating, or stop saving to the order. Here is what actually changed, and how to add fields that work the same on both.
Why the Block checkout breaks classic field plugins
The classic checkout renders on the server with PHP and hooks like woocommerce_checkout_fields. The
Block checkout is a React app that talks to the Store API, so a field added the old PHP way never
appears in the Block, and a value posted the old way never reaches the order. Plugins that only hook
the classic checkout simply have nothing to attach to. To work on the Block checkout a field has to:
- render inside the Block (registered through the Store API, not echoed by a PHP hook),
- react live as the shopper changes shipping, payment or address,
- validate server-side on submit (never trust the browser), and
- save to the order — including under High-Performance Order Storage (HPOS).
Miss any one of those and the field looks fine but quietly loses data.
Add fields that work on both — with Alovio Checkout Fields
Alovio Checkout Fields is a free WordPress plugin built for exactly this. Install it from Plugins → Add New, activate, and open WooCommerce → Checkout Fields. You get a drag-and-drop builder, and every field renders and behaves identically on the classic checkout and the Block (Store API) checkout — no asterisks.
- Add a field (text, textarea, number, checkbox, choice, dropdown or a section heading).
- Choose where it goes — after order notes, before payment, after customer details.
- Save. It appears on whichever checkout your store uses, right away.
Conditional logic, live, on the Block checkout
The point of custom fields is asking for the right things at the right time. With Alovio Checkout Fields you can show, hide or require any field based on cart contents, product category, customer role, shipping method, payment method, country — or another field — with multi-condition AND/OR rules. On the Block checkout the rules re-evaluate live: pick “bank transfer” and a “purchase order number” field can appear instantly; switch to card and it disappears. And unlike most plugins in this category, the conditional engine is free, not gated behind a Pro tier — see how it compares to a Checkout Field Editor alternative.
Make sure the values actually stick
A field is only useful if the value survives. Alovio Checkout Fields validates required and conditionally-required fields on the server, saves the value to the order in an HPOS-safe way, and shows it on the admin order screen and in the order emails — on both checkouts. (More detail in the classic & Block docs.)
In short
The Block checkout did not “lose” custom fields — it changed how they have to be built. Use a plugin written for the Store API, keep your validation on the server, and your fields will render, react and save the same whether your store runs the classic or the Block checkout.