Targets Overview
A target represents where your checkout UI extension will appear.
You register for targets in your configuration file, and you include a JavaScript function that will run at that location in checkout.
Anchor to supported-locationsCheckout locations
Checkout is where buyers go to purchase goods. Checkout consists of the information, shipping, and payment steps in addition to the order summary and Shop Pay. Learn more about building custom functionality for checkout.
Anchor to checkout-locations-informationInformation
This is the first step in the checkout process where the buyer enters contact information and a delivery address.
Point in checkout where the buyer selects a shipping method.
Point in checkout where the buyer enters their payment information.
Anchor to checkout-locations-order-summaryOrder summary
Summary of the cart contents, discounts, and order totals.
Accelerated checkout where Shopify pre-fills buyer information using their Shop Pay account.
Anchor to checkout-locations-local-pickupLocal Pickup
Point in checkout where the buyer can select a store location to pick up their purchase.
Anchor to checkout-locations-pickup-pointsPickup Points
Point in checkout where the buyer can select a pickup point to have their purchase delivered to.
Anchor to checkout-locations-one-page-checkoutOne-page checkout
All checkout pages (information, shipping, and payment) are combined into a single page with the order summary.
Get started testing extensions on one-page checkout.
Anchor to supported-typ-locationsThank you locations
The Thank you page is shown to buyers immediately after a checkout is successfully submitted. Learn more about building for the Thank you page.
Anchor to thank-you-locations-order-detailsOrder details
Displays all order information to buyers.
Anchor to thank-you-locations-order-summaryOrder summary
Summary of the cart contents, discounts, and order totals.
Anchor to supported-osp-locationsOrder status locations
The Order status page is shown to buyers when they return to a completed checkout for order updates. Learn more about building for the Order status page.
Anchor to order-status-locations-order-detailsOrder details
Displays all order information to buyers.
Anchor to order-status-locations-order-summaryOrder summary
Summary of the cart contents, discounts, and order totals.
Anchor to static-extension-targetsStatic extension targets
Static extension targets render immediately before or after most core checkout features such as contact information, shipping methods, and order summary line items. Merchants use the checkout editor to activate and place the extension in the checkout experience.
When a core checkout feature isn't rendered, neither are the static extension targets tied to it. For example, shipping methods aren't shown when customers select the option for store pickup and the UI extensions that load before or after the shipping method aren't rendered.
Choose static extension targets when your content and functionality is closely related to a core checkout feature. An example is a shipping delay notice.
Anchor to block-extension-targetsBlock extension targets
Block extension targets render between core checkout features. Merchants can use the checkout editor to place the extension in the checkout, Thank you, or Order status pages.
Block extensions are always rendered, regardless of what other elements of the checkout are present. For example, an extension placed above the shipping address will still render even for digital products which do not require a shipping address.
Choose block extension targets when your content and functionality works independently of a core checkout feature. This is useful for custom content, like a field to capture order notes from the customer.
