Version 2025-07 is the last API version to support React-based UI components. Later versions use web components, native UI elements with built-in accessibility, better performance, and consistent styling with Shopify's design system. Check out the migration guide to upgrade your extension.
Information
The information step is where buyers enter their email address or phone number and, for shipping orders, a delivery address. Use this target to add UI immediately after the contact form, such as marketing opt-in checkboxes, loyalty account lookups, or contact verification messaging.
Anchor to Use casesUse cases
- Marketing opt-in: Display a checkbox after the email field to collect buyer consent for email or SMS marketing and store the opt-in status.
- Loyalty account lookup: Check whether the buyer's email matches an existing loyalty account, and display their points balance or membership tier to encourage checkout completion.
- Phone or email verification: Display a verification prompt or format guidance after the buyer enters their phone number or email address, helping ensure accurate contact information before the order is placed.
- Gift messaging: Collect a gift message or special delivery instructions right after the contact form, and attach the information to the order.
Anchor to Information targetInformation target
A static extension target that renders below the customer information section in checkout. Unlike block targets, this target always renders in a fixed position relative to the customer information.
Anchor to Render after contact form ,[object Object]Render after contact form target
purchase.checkout.contact.render-after
Renders immediately after the contact form element on the information step. Use this target to display consent checkboxes, account lookups, or supplementary fields that relate to the buyer's contact information.
Read access to cart contents, buyer identity, and delivery details is available through API properties. Write operations are available through the note API and metafields API. Use cart instructions to check which mutations are available before calling them.
Supported components
- Badge
- Banner
- Block
Layout - Block
Spacer - Block
Stack - Button
- Chat
- Checkbox
- Choice
- Choice
List - Clipboard
Item - Consent
Checkbox - Consent
Phone Field - Date
Field - Date
Picker - Disclosure
- Divider
- Drop
Zone - Form
- Grid
- Grid
Item - Heading
- Heading
Group - Icon
- Image
- Inline
Layout - Inline
Spacer - Inline
Stack - Link
- List
- List
Item - Map
- Map
Marker - Map
Popover - Modal
- Payment
Icon - Phone
Field - Popover
- Pressable
- Product
Thumbnail - Progress
- QR code
- Scroll
View - Select
- Sheet
- Skeleton
Image - Skeleton
Text - Skeleton
Text Block - Spinner
- Stepper
- Switch
- Tag
- Text
- Text
Block - Text
Field - Toggle
Button - Toggle
Button Group - Tooltip
- View
Available APIs
- Addresses API
- Analytics API
- Attributes API
- Buyer Identity API
- Buyer Journey API
- Cart Instructions API
- Cart Lines API
- Checkout Token API
- Cost API
- Customer Privacy API
- Delivery API
- Discounts API
- Extension API
- Gift Cards API
- Localization API
- Localized Fields API
- Metafields API
- Note API
- Payments API
- Session Token API
- Settings API
- Shop API
- Storage API
- Storefront API
- UI API
Supported components
- Badge
- Banner
- Block
Layout - Block
Spacer - Block
Stack - Button
- Chat
- Checkbox
- Choice
- Choice
List - Clipboard
Item - Consent
Checkbox - Consent
Phone Field - Date
Field - Date
Picker - Disclosure
- Divider
- Drop
Zone - Form
- Grid
- Grid
Item - Heading
- Heading
Group - Icon
- Image
- Inline
Layout - Inline
Spacer - Inline
Stack - Link
- List
- List
Item - Map
- Map
Marker - Map
Popover - Modal
- Payment
Icon - Phone
Field - Popover
- Pressable
- Product
Thumbnail - Progress
- QR code
- Scroll
View - Select
- Sheet
- Skeleton
Image - Skeleton
Text - Skeleton
Text Block - Spinner
- Stepper
- Switch
- Tag
- Text
- Text
Block - Text
Field - Toggle
Button - Toggle
Button Group - Tooltip
- View
Available APIs
- Addresses API
- Analytics API
- Attributes API
- Buyer Identity API
- Buyer Journey API
- Cart Instructions API
- Cart Lines API
- Checkout Token API
- Cost API
- Customer Privacy API
- Delivery API
- Discounts API
- Extension API
- Gift Cards API
- Localization API
- Localized Fields API
- Metafields API
- Note API
- Payments API
- Session Token API
- Settings API
- Shop API
- Storage API
- Storefront API
- UI API
Anchor to Best practicesBest practices
- Revert UI on failure: When a mutation fails, revert the UI to its previous state so buyers aren't misled into thinking their input was saved.
Anchor to LimitationsLimitations
- Contact data is read-only: Extensions at this target can read the buyer's contact information through hooks like
useEmail()andusePhone()but can't modify the contact form fields or pre-fill values.