Shopify checkout extension
not appearing.
An installed checkout UI extension doesn't show up in the checkout editor or the live checkout page. Five likely causes below, ranked by frequency, with the fix for each and a scaffolding TOML checklist.
Symptoms
- Extension is not listed in the "Add block" menu inside the checkout editor.
- Extension is checked in Admin but remains completely invisible in the frontend customer checkout.
- Checkout editor crashes or shows a blank gray block when dragging the extension into position.
Scaffolding check
Verify your block render targets are correctly registered in your extension config file. An incorrect targeting name will prevent Shopify from listing the block in the editor.
// Shopify Checkout extension target registration
// Verify target declaration inside your checkout.toml or shopify.extension.toml configuration file.
[[extensions.targeting]]
target = "purchase.checkout.block.render"
module = "./src/Checkout.jsx"
[extensions.capabilities]
api_access = trueMost likely causes, ranked
- 01The Shopify store is not on a Plus-compatible plan.
Checkout UI Extensions are exclusively available to stores on the Shopify Plus plan (or Shopify Partner development stores with Checkout Extensibility preview enabled). On standard or advanced plans, custom extensions will not render.
Fix: Upgrade the store to Shopify Plus or test the extension strictly inside a Plus-enabled development sandbox.
- 02Extension not manually placed in the Checkout Editor.
Installing a Checkout App does not automatically inject it into the page. The merchant must manually place it in the checkout layout.
Fix: In Shopify Admin → Settings → Checkout, click Customize beside your checkout profile. In the left panel, click Add block, select the extension, and drag it to your desired position. Click Save.
- 03Target anchor point is unsupported or incorrect.
The targeting configuration in
shopify.extension.tomlspecifies a rendering target (e.g.purchase.checkout.block.render) but the code tries to render on an anchor that isn't supported or active in that specific checkout step.Fix: Double-check the target string in both
shopify.extension.tomland your React/Javascript index entry point. They must match exactly. - 04Draft status / app not deployed.
The extension is running locally on your development server (
shopify app dev), but the local tunnel is down, or you are trying to view the live site before running a production deploy.Fix: Deploy the app: run
shopify app deploy. Go to the Shopify Partner Dashboard, navigate to your app details, and ensure the production extension version is released. - 05Missing permissions or API scopes.
Your extension attempts to fetch cart details or metafields that require specific API scopes (like read_products or checkout access), but the app installation token lacks those permissions.
Fix: Update
shopify.app.tomlwith the required scopes. Runshopify app deployagain, then re-install or re-authorise the app inside Shopify Admin.
Need a Checkout Extension built?
Custom checkout fields, upsells, trust indicators, and custom delivery options increase AOV and reduce support load. We build reliable, fully responsive Checkout UI extensions.