Skip to main content
Checkout is a single element that renders sections for shopper contact, addresses, a payment method selector, and any custom fields you configure. Each section is opt-in (except payment methods, which are required). Section keys accept the options their underlying element supports — see each per-section page for the exact keys. Field-level required and validate apply only to contact, address, and custom sections.

Section keys

Include a key to render that section. Omit it to hide it.

Default order

  1. Contact
  2. Shipping address
  3. Billing address
  4. Payment methods
  5. Custom elements
Override with order. Sections you did not include are ignored.

Nesting standalone options

Section keys accept the options their underlying element supports — labels, placeholders, per-field hidden, and any element-specific knobs.
required and validate are field-level options on the contact, address, and custom elements — they do not apply to card, bank, or the wallets, and they don’t apply to the checkout root itself. See each element’s reference for the exact options it accepts. Per-method options for cards, bank, Apple Pay, and Google Pay live under their method key (card, bank, applePay, googlePay), not inside paymentMethods.

Errors carry a source

Every per-field error emitted by Checkout uses the standard FieldError shape, with source identifying which section produced it:
FieldError[] appears on both onChange.errors and onError.fieldErrors. Filter or group on source when surfacing a page-level summary. Top-level Checkout failures (network, tokenization, unknown) arrive on onError as the standard OverflowErrorEvent envelope — see Error codes.

Section pages

Contact

Email, name, phone, company.

Shipping address

Options that pass to the shipping element.

Billing address

Options that pass to the billing element.

Payment methods

Method list, default, and per-method options.

Custom elements

Slots for merchant-defined fields.
Last modified on July 29, 2026