---
title: Targets
description: >-
  Targets define where your checkout UI extensions appear within Shopify
  checkout and what capabilities they receive. Targets serve specific purposes.
api_version: 2026-04
api_name: checkout-ui-extensions
source_url:
  html: 'https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets'
  md: 'https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets.md'
---

# Targets

Targets define where your checkout UI extensions appear within [Shopify checkout](https://shopify.dev/docs/apps/build/checkout) and what capabilities they receive.

Targets serve specific purposes. Some render persistent UI elements at fixed locations in checkout, others render only in specific contexts like delivery selection or payment, and some appear only when certain checkout features are active.

You can define targets on either the checkout or Thank you page. See the [Checkout](#checkout-targets) and [Thank you page](#thank-you-page-targets) sections to see which targets are available on each page and where they display in the checkout flow.

![Checkout UI targets overview](https://shopify.dev/assets/assets/images/api/checkout-ui-extensions/targets-overview-images/targets-overview-checkout-S60PkVaN.png)

***

## Configuring targets

To use targets in your extension, you need to configure them in your `shopify.extension.toml` [configuration file](https://shopify.dev/docs/apps/build/app-extensions/configure-app-extensions).

You can define one or more targets in your configuration file using the `extensions.targeting` field. Along with the `target` value, you also need to specify the code module to execute. You specify the path to your code file by using the `module` property.

If you define a single target for your extension, then the code module should default export the extension root for that target. If you define multiple targets for your extension, then you must define a separate code module for each target, where each module has a default export.

## shopify.extension.toml

##### Single target

```toml
# ...

[[extensions.targeting]]
target = "purchase.checkout.block.render"
module = "./Block.jsx"

# ...
```

##### Two targets

```toml
# ...

[[extensions.targeting]]
target = "purchase.checkout.actions.render-before"
module = "./Actions.jsx"

[[extensions.targeting]]
target = "purchase.checkout.shipping-option-item.render-after"
module = "./ShippingOptions.jsx"

# ...
```

***

## Target types

There are two types of targets available for checkout UI extensions, static extension targets and block extension targets.

### Static extension targets

Static extension targets render immediately before or after core checkout features such as contact information, shipping methods, and order summary line items. Merchants use the [checkout and accounts editor](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor) to activate and place the extension in the checkout experience.

When a core checkout feature isn't rendered, the static extension targets tied to it aren't rendered either. For example, shipping methods aren't shown when buyers select the option for store pickup, so the 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, such as a shipping delay notice.

![Diagram showing a core checkout feature block with extension target slots labeled purchase.checkout.render-before above it and purchase.checkout.render-after below it.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/static-extension-targets-B__nVhUd.png)

### Block extension targets

Shopify checkout is a complex, multi-step workflow. To provide merchants with more flexibility in how they customize this flow, block extension targets can be repositioned at different points in checkout by using the [checkout and accounts editor](https://help.shopify.com/en/manual/checkout-settings/customize-checkout-configurations/checkout-editor). Use block extension targets when the target's content and functionality isn't specific to a particular part of the checkout flow.

Unlike static targets, block extensions are always rendered, even if the section they're positioned in is hidden. For example, an extension placed above a shipping address displays even for digital products where an address isn't required.

During development, you can test your extension at each of the supported locations using a local development server. After running `shopify app dev` to start the server, append a `placement-reference` to the end of the URL for your dev store's checkout. For example, to preview your extension above the contact information section, add `?placement-reference=INFORMATION1`. For the full list of placement references and where each one renders, see the [checkout block target](https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets/checkout/block#placement-references) and [Thank you block target](https://shopify.dev/docs/api/checkout-ui-extensions/latest/targets/thank-you/block#placement-references) pages.

You can also use placement references to define the default location for these targets by setting the `default_placement` property in your extension's [TOML configuration file](https://shopify.dev/docs/apps/build/app-extensions/configure-app-extensions#checkout-ui-extensions). This default is the location merchants first see when they use the checkout and accounts editor to configure your extension.

[Learn more - Placement references](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#placement-references)

![Diagram showing a core checkout feature block with block extension target slots labeled purchase.checkout.block.render both above and below, connected with dotted lines.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/block-extension-targets-CtyfeobB.png)

***

## Checkout targets

Checkout targets let you extend specific sections of the checkout experience where buyers make purchase decisions. These targets appear during different parts of the checkout flow, from delivery selection to payment, and provide contextual access to relevant buyer and cart information.

### Address

The address section targets provide address autocomplete functionality during checkout. These targets enable you to customize how address suggestions are provided and formatted for buyers as they fill out delivery, billing, and pickup point address forms.

**Use cases**: Custom address lookup services or region-specific address formats.

[View address targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/address)

##### Suggest address runnable

`purchase.address-autocomplete.suggest`

A runnable target that provides address autocomplete suggestions for address forms at checkout.

##### Format address suggestion runnable

`purchase.address-autocomplete.format-suggestion`

A runnable target that formats the selected address suggestion provided by a `purchase.address-autocomplete.suggest` target.

![Checkout delivery address form with a Suggestions panel open showing the purchase.address-autocomplete.suggest target slot where address suggestions appear as the buyer types.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.address-autocomplete.suggest-CBxAFb6p.png)

![Checkout delivery address form with a Suggestions panel open showing both the purchase.address-autocomplete.suggest and purchase.address-autocomplete.format-suggestion target slots for providing and formatting address suggestions.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.address-autocomplete.format-suggestion-Cy8hEuqJ.png)

### Block

The block target isn't tied to a specific checkout section or feature. Block extensions render where merchants place them using the [checkout and accounts editor](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor).

**Use cases**: Flexible content placement, merchant-customizable features, trust badges, promotional content, or any functionality that needs merchant-controlled positioning.

[View block targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/block)

##### Render block

`purchase.checkout.block.render`

A block target that isn't tied to a specific checkout section or feature. Unlike static targets, block targets render where the merchant sets them using the [checkout and accounts editor](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor).

![Checkout page showing payment options (PayPal, Cash on Delivery) with two purchase.checkout.block.render target slots, one between the payment methods and the Remember me section and one near the discount code field.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.block.render-1ASRzz4U.png)

### Footer

The footer section appears at the bottom of every checkout page.

**Use cases**: Links to custom policy information (for example, refund, shipping, or privacy policies), trust signals and badges, custom branding, consent collection, or additional legal disclaimers.

[View footer targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/footer)

##### After footer static

`purchase.checkout.footer.render-after`

A static target that renders below the footer.

![Checkout page showing policy links (Return policy, Privacy policy, Terms of service) with the purchase.checkout.footer.render-after target slot below the footer links at the bottom of the page.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.footer.render-after-pNKB6ZT3.png)

### Header

The header section appears at the top of every checkout page, providing a prominent location for important messaging or branding that should be visible throughout the checkout flow.

**Use cases**: Promotional banners, custom breadcrumbs, important announcements, brand messaging, shipping thresholds, or progress indicators.

[View header targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/header)

##### After header static

`purchase.checkout.header.render-after`

A static target that renders below the header.

![Checkout page showing the store logo at the top with the purchase.checkout.header.render-after target slot directly below the header, above the order summary and express checkout options.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.header.render-after-DGug1ugt.png)

### Information

The information section contains the buyer's contact details that are collected early in the checkout process. This section appears before delivery and payment information.

**Use cases**: Newsletter subscriptions, phone number verification, marketing consent, or additional contact preferences.

[View information targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/information)

##### After contact static

`purchase.checkout.contact.render-after`

A static target that renders immediately after the contact form element.

![Checkout Contact section showing an email field and a marketing opt-in checkbox, with the purchase.checkout.contact.render-after target slot below the contact fields, above the Delivery section.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.contact.render-after-Be7zvxCD.png)

### Local pickup

The local pickup section appears when buyers can select a store location to pick up their purchase instead of having items shipped to an address. This section displays available pickup locations with their addresses and pickup time estimates.

**Use cases**: Location-specific information, pickup time customization, inventory availability notices, or special instructions for store pickup.

[View local pickup targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/local-pickup)

##### Before pickup location list static

`purchase.checkout.pickup-location-list.render-before`

A static target that renders before pickup location options.

##### After pickup location list static

`purchase.checkout.pickup-location-list.render-after`

A static target that renders after pickup location options.

##### After pickup location item static

`purchase.checkout.pickup-location-option-item.render-after`

A static target that renders after the pickup location details within the local pickup option list, for each option.

![Checkout delivery section with Ship and Pickup tabs selected, showing the purchase.checkout.pickup-location-list.render-before target slot above the store pickup location list.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.pickup-location-list.render-before-cJRuDahO.png)

![Checkout delivery section with Ship and Pickup tabs selected, showing the store pickup location list with the purchase.checkout.pickup-location-list.render-after target slot below all pickup location options.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.pickup-location-list.render-after-BKtqYBs1.png)

![Checkout delivery section showing a store pickup option with store name, address, and availability time, with the purchase.checkout.pickup-location-option-item.render-after target slot inside each location item below the availability text.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.pickup-location-option-item.render-after-DCGhkOyM.png)

### Navigation

The navigation section contains the action buttons that allow buyers to progress through the checkout steps, such as **Continue to shipping** or **Pay now** buttons.

**Use cases**: Marketing opt-in consent, gift note collection, contextual cart messaging, or loyalty reward points display.

[View navigation targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/navigation)

##### Before actions static

`purchase.checkout.actions.render-before`

A static target that renders immediately before any actions within each step.

![Checkout page showing order total, discount code field, and the purchase.checkout.actions.render-before target slot directly above the Pay now button.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.actions.render-before-Cax0Qz3i.png)

### Order summary

The order summary displays the buyer's cart contents, including line items, discounts, and price breakdowns. It appears on every checkout page, providing a persistent view of the purchase.

**Use cases**: Product warranties, gift wrapping options, loyalty program information, or custom pricing details.

[View order summary targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/order-summary)

##### After cart line item static

`purchase.checkout.cart-line-item.render-after`

A static target that renders on every line item, inside the details under the line item properties element.

##### After cart line list static

`purchase.checkout.cart-line-list.render-after`

A static target that renders after all line items.

##### After reductions static

`purchase.checkout.reductions.render-after`

A static target that renders in the order summary, after the discount form and discount tag elements.

##### Before reductions static

`purchase.checkout.reductions.render-before`

A static target that renders in the order summary, before the discount form element.

![Order summary in checkout showing three items (Lipstick, Gel Moisturizer, Rich Brightening Mask) each with a purchase.checkout.cart-line-item.render-after target slot appearing below each individual item's details.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.cart-line-item.render-after-YM2LO-QZ.png)

![Order summary in checkout showing three items with the purchase.checkout.cart-line-list.render-after target slot below the full item list, above the discount code field.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.cart-line-list.render-after-Cl_A0e6H.png)

![Order summary in checkout showing items and a discount code field, with the purchase.checkout.reductions.render-after target slot between the discount field and the subtotal, taxes, and total breakdown.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.reductions.render-after-Dz997X9J.png)

![Order summary in checkout showing items with the purchase.checkout.reductions.render-before target slot above the discount code field, above the price breakdown.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.reductions.render-before-mhyZjGOO.png)

### Payment

The payment section is where buyers select their payment method and enter payment details. This critical step in the checkout flow determines how buyers will complete their purchase.

**Use cases**: Payment plan information, security badges, accepted payment icons, financing options, or additional payment instructions.

[View payment targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/payment)

##### After payment method list static

`purchase.checkout.payment-method-list.render-after`

A static target that renders below the list of payment methods.

##### Before payment method list static

`purchase.checkout.payment-method-list.render-before`

A static target that renders between the payment heading and payment method list.

![Checkout Payment section showing credit card fields, PayPal and Cash on Delivery options, with the purchase.checkout.payment-method-list.render-after target slot below all payment method options.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.payment-method-list.render-after-DL9axDZq.png)

![Checkout Payment section showing the Payment heading with the purchase.checkout.payment-method-list.render-before target slot directly above the list of payment method options.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.payment-method-list.render-before-DglteXKE.png)

### Pickup points

The pickup points section appears when buyers can select a carrier-managed pickup location (such as a post office or parcel locker) for their delivery. This is different from local pickup at a merchant's store location.

**Use cases**: Pickup point instructions, service area information, operating hours, identification requirements, or custom pickup point details.

**Beta:**

Pickup points are in early access and available only to custom apps built for stores on the [Shopify Plus](https://www.shopify.com/plus) plan. Stores must also have eligible fulfillment locations and use eligible Shopify Shipping carriers.

[View pickup points targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/pickup-points)

##### After pickup point list static

`purchase.checkout.pickup-point-list.render-after`

A static target that renders immediately after the pickup points.

##### Before pickup point list static

`purchase.checkout.pickup-point-list.render-before`

A static target that renders immediately before the pickup points.

![Checkout delivery section showing a pickup point card with location name, address, opening hours, and a pagination control, with the purchase.checkout.pickup-point-list.render-after target slot below the pickup point list.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.pickup-point-list.render-after-B9Epmn56.png)

![Checkout delivery section with Ship and Pickup point tabs, showing the purchase.checkout.pickup-point-list.render-before target slot above a map of nearby pickup points.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.pickup-point-list.render-before-DKBnLy0q.png)

### Shipping

The shipping section is where buyers view their delivery address and select a shipping method for their order. This section includes shipping options with rates, estimated delivery times, and any special delivery instructions.

**Use cases**: Delivery date selection, shipping insurance options, carbon offset programs, special delivery instructions, shipping method recommendations, or split shipping customization.

[View shipping targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/checkout/shipping)

##### After delivery address static

`purchase.checkout.delivery-address.render-after`

A static target that renders after the shipping address form elements.

##### Before delivery address static

`purchase.checkout.delivery-address.render-before`

A static target that renders between the shipping address header and shipping address form elements.

##### Shipping option item details static

`purchase.checkout.shipping-option-item.details.render`

A static target that renders under the shipping method within the shipping method option list, for each option.

##### After shipping option item static

`purchase.checkout.shipping-option-item.render-after`

A static target that renders after the shipping method details within the shipping method option list, for each option.

##### After shipping option list static

`purchase.checkout.shipping-option-list.render-after`

A static target that renders after the shipping method options.

##### Before shipping option list static

`purchase.checkout.shipping-option-list.render-before`

A static target that renders between the shipping method header and shipping method options.

![Checkout delivery address form showing Address, Apartment, City, Province, and Postal code fields, with the purchase.checkout.delivery-address.render-after target slot below the address form, above the Shipping method section.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.delivery-address.render-after-BswtkW9F.png)

![Checkout page showing the Contact section with email field and marketing checkbox, then the Delivery section with the purchase.checkout.delivery-address.render-before target slot above the delivery address form fields.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.delivery-address.render-before-CNlsVMon.png)

![Checkout Shipping method section with FedEx Ground selected, showing the purchase.checkout.shipping-option-item.details.render target slot inside the expanded selected shipping option, between the carrier name/price row and the next option.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.shipping-option-item.details.render-CJ1jsPT7.png)

![Checkout Shipping method section showing FedEx Ground and USPS Priority options, each with a purchase.checkout.shipping-option-item.render-after target slot below the carrier name and estimated delivery time.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.shipping-option-item.render-after-Ic0dSuAe.png)

![Checkout Shipping method section showing FedEx Ground and USPS Priority options, with the purchase.checkout.shipping-option-list.render-after target slot below the full list of shipping options, above the Payment section.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.shipping-option-list.render-after-BVHC2Coc.png)

![Checkout Shipping method section with the purchase.checkout.shipping-option-list.render-before target slot above the list of shipping options showing FedEx Ground and USPS Priority.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.checkout.shipping-option-list.render-before-CfrAT0qv.png)

***

## Thank you page targets

Thank you page targets let you extend the order confirmation experience after buyers complete their purchase.

### Announcement

The announcement section displays dismissable content at the top of the Thank you page, ideal for important messages that buyers should see after completing their purchase.

**Use cases**: Order confirmation details, special promotions, referral programs, app download prompts, or survey requests.

[View announcement targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/announcement)

##### Announcement render static

`purchase.thank-you.announcement.render`

A static target that renders on top of the Thank you page as a dismissable announcement.

![Thank you page showing a store logo with the purchase.thank-you.announcement.render target slot at the very top of the page, above the header.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.announcement.render-CEX27kXq.png)

### Block

The block target provides a flexible target on the Thank you page that isn't tied to a specific section. Block extensions render where merchants place them using the [checkout and accounts editor](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor), giving them control over the placement.

**Use cases**: Post-purchase offers, loyalty program signups, product recommendations, social sharing prompts, or review requests.

[View block targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/block)

##### Render block

`purchase.thank-you.block.render`

A block target that renders exclusively on the Thank you page. Unlike static targets, block targets render where the merchant sets them using the [checkout and accounts editor](https://shopify.dev/docs/apps/build/checkout/test-checkout-ui-extensions#test-the-extension-in-the-checkout-editor).

![Thank you page showing an order confirmation message with the purchase.thank-you.block.render target slot below the confirmation heading.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.block.render-Bc7_9thx.png)

### Footer

The footer section appears at the bottom of the Thank you page, providing a location for information that should be visible after purchase completion.

**Use cases**: Return policy information, customer support contact details, social media links, or additional legal disclaimers.

[View footer targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/footer)

##### After footer static

`purchase.thank-you.footer.render-after`

A static target that renders below the footer on the Thank you page.

![Thank you page showing a Continue shopping button, a Need help contact link, and policy links (Return policy, Privacy policy, Terms of service), with the purchase.thank-you.footer.render-after target slot below all footer links.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.footer.render-after-C69NoMpQ.png)

### Header

The header section appears at the top of the Thank you page, providing a prominent location for important messaging after purchase completion.

**Use cases**: Order tracking links, delivery estimates, thank you messages, special offers, or next steps instructions.

[View header targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/header)

##### After header static

`purchase.thank-you.header.render-after`

A static target that renders below the header on the Thank you page.

![Thank you page showing the store logo with the purchase.thank-you.header.render-after target slot directly below the header logo, above the order summary.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.header.render-after-CkLAx5yZ.png)

### Information

The information section displays the buyer's contact and delivery details on the Thank you page, confirming where the order will be sent and how the buyer can be reached.

**Use cases**: Referral program prompts, loyalty enrollment offers, order follow-up details, account creation, or post-purchase feedback collection.

[View information targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/information)

##### After customer information static

`purchase.thank-you.customer-information.render-after`

A static target that renders after a purchase below the customer information on the Thank you page.

![Thank you page showing shipping method (FedEx Ground), payment method (Visa card ending in 4242), and billing address details, with the purchase.thank-you.customer-information.render-after target slot below the customer information section.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.customer-information.render-after-DnJ2dyLP.png)

### Order summary and details

Order summary and details show the complete purchase information on the Thank you page, including line items with pricing and order details like shipping address, payment method, and delivery information.

**Use cases**: Product care instructions, warranty information, return policy details, cross-sell opportunities, or item-specific next steps.

[View order summary and details targets →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/thank-you/order-summary)

##### After cart line item static

`purchase.thank-you.cart-line-item.render-after`

A static target that renders on every line item, inside the details under the line item properties element on the Thank you page.

##### After cart line list static

`purchase.thank-you.cart-line-list.render-after`

A static target that renders after all line items on the Thank you page.

![Thank you page order summary showing purchased items (Lipstick, Gel Moisturizer, Rich Brightening Mask) with the purchase.thank-you.cart-line-item.render-after target slot below each individual line item.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.cart-line-item.render-after-C2-UWGBI.png)

![Thank you page order summary showing purchased items with the purchase.thank-you.cart-line-list.render-after target slot below the complete item list, above the subtotal breakdown.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/purchase.thank-you.cart-line-list.render-after-MCsb-p61.png)

***

## Page layouts

Page layouts determine how checkout information is organized and presented to buyers. Different layouts affect how your extensions render and which steps buyers navigate through.

[View page layouts →](https://shopify.dev/docs/api/checkout-ui-extensions/2026-04/targets/page-layouts)

##### Three-page checkout layout

The three-page checkout layout is the default checkout experience. It separates the checkout process into distinct pages: information, shipping, and payment. Buyers progress through each page sequentially, completing one step before moving to the next.

Extensions render on the specific page corresponding to their target's location in the checkout flow.

##### One-page checkout layout

In one-page checkout, all checkout steps (information, shipping, and payment) are combined into a single page alongside the order summary. This layout presents the entire checkout flow on one screen, allowing buyers to see and complete all steps without page transitions.

Extensions render in their respective sections within the single-page layout, and buyers can scroll through all checkout sections at once.

##### Accelerated checkout page layout

Shop Pay provides an accelerated checkout experience by pre-filling buyer information from the buyer's Shop Pay account. This streamlined flow may combine or skip some checkout steps.

![Three-page checkout showing the shipping step with the buyer's ship-to address summary, FedEx Ground and USPS Priority shipping options, and a Continue to payment button.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/page.layout.three-page-BugZN_cv.png)

![One-page checkout showing shipping method selection with FedEx Ground and USPS Priority options alongside the Payment section with credit card fields on the same page.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/page.layout.one-page-JFqM_803.png)

![Accelerated Shop checkout showing a logged-in buyer's contact email, shipping address, and shipping method section in a compact single-column layout.](https://shopify.dev/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/page.layout-shop-CMg24SOL.png)

***