Customer Account UI Extensions for B2B Portals.

Every surface an app can extend inside Shopify's hosted customer accounts, what stays sealed, and how a working B2B portal gets built on top.

What are Shopify customer account extensions?

Customer account UI extensions are app-built components that render inside Shopify's hosted customer accounts. Shopify defines the injection points: the order index, order status, and profile pages, order action menus, and entirely new full-page routes. Extensions are written in Preact against Shopify's Polaris web components, configured in shopify.extension.toml, and executed in a sandboxed Web Worker. There is no direct DOM access and no arbitrary HTML or CSS; the extension composes the component set Shopify exposes, and the rendered UI inherits the merchant's brand settings automatically.

Two platform rules frame everything else. First, extensions run only on the current version of customer accounts: legacy customer accounts support no UI extensions. Second, Shopify B2B itself requires customer accounts, and legacy accounts cannot be used for B2B customers at all. Every store running native Shopify B2B is therefore already on the exact account surface extensions extend. That makes customer account UI extensions the sanctioned way to turn Shopify's stock account pages into a working B2B portal, without a replatform and without a custom storefront.

Which surfaces can an extension target?

The targets reference (API version 2026-01) exposes extension points across seven surfaces:

Targets come in two behaviors. Static targets render in one fixed location and merchants cannot move them; block targets can be repositioned by the merchant in the checkout and accounts editor, but only among supported placements. For the order action menu, Shopify's own listed use cases are return request buttons, reorder functionality, exporting order data, and managing subscriptions.

What can full-page extensions do?

Full-page extensions create entirely new pages in customer accounts. They render in the main content area, below the header and above the footer. Shopify's named use cases are wishlists, loyalty programs, return requests, subscription management, and custom order views. When a merchant adds one in the checkout and accounts editor, they are prompted to add it to the customer account header menu, and the page gets a static URL that can be deep-linked. The Navigation API supports multi-route extensions through navigation.navigate() and the extension:// and shopify:customer-account/ protocols, and customers reach these pages without leaving their account or logging in again.

The order-scoped variant, customer-account.order.page.render, receives the order via shopify.order and its line items via shopify.lines; the data loads asynchronously and may be undefined on first render. One structural constraint applies to all of this: a full-page target cannot coexist with any other target in the same extension, so a portal that also injects inline blocks splits across multiple extensions.

For B2B, full pages are the surface that matters most. A quotes inbox, an approvals queue, a spend dashboard, a batch invoice payment screen: these are complete workflows, not inline widgets, and full-page extensions are the only mechanism that adds whole new account pages. A theme cannot do this; themes stop at the storefront, as covered in B2B themes and portals.

How does an extension know the buyer is a B2B company?

The Authenticated Account API gives read-only access to the signed-in customer's ID and their B2B purchasing company. When shopify.authenticatedAccount.purchasingCompany is non-null, it exposes company.id and location.id, and it is supported on 24 targets:

const purchasingCompany =
  shopify.authenticatedAccount.purchasingCompany.value;

if (purchasingCompany) {
  const {company, location} = purchasingCompany;
  // render company-specific UI for this location
}

On top of detection, the four Profile (B2B) targets render only for B2B customers, alongside Shopify's native company and location management UI. Shopify's suggested uses: account manager contact details, delivery zone restrictions and warehouse details per location, credit terms and approved payment methods, and staff role descriptions with onboarding links. This slots directly into the company structure described in companies, contacts, and permissions.

The login context is worth knowing when designing these flows. B2B sign-in is passwordless: the buyer enters the email associated with a company location plus a one-time PIN, and contacts assigned to multiple locations pick which location they are ordering for. Plus stores can replace the default login with their own OpenID Connect identity provider.

What data can an extension read and write?

• Customer Account API. Extensions call fetch('shopify://customer-account/api/{version}/graphql.json') directly; authentication is handled automatically, with no session token. Reading customer and order resources requires scopes such as customer_read_orders, and the API requires Level 1 protected customer data access.
• Storefront API. shopify.query() with the api_access capability queries products, collections, and metaobjects through a prefetched token.
• External backends. Calls to your own servers require the network_access capability. Because the sandboxed worker sends requests with no recognizable origin, your server must respond with Access-Control-Allow-Origin: *.
• Metafields. All targets can read and write metafields through the Customer Account API; order status targets can also read app-owned metafields with no network call via shopify.appMetafields.
• Merchant settings. Up to 20 settings per definition let merchants configure the extension from the checkout and accounts editor.

One open question for contract pricing: Shopify documentation does not state whether Storefront API responses inside a customer account extension are automatically contextualized with the buyer's company location. The headless B2B docs require explicit buyer contextualization, so verify price behavior in a development store before relying on shopify.query() for contract prices.

What is sealed in customer accounts?

The extension model is deliberately closed. The hard limits, each from Shopify's documentation:

Platform-level B2B constraints also cap what any portal can do: Shopify B2B does not support purchase options such as subscriptions, pre-orders, and try before you buy, and the shipping and billing addresses cannot be edited during B2B checkout. Plan gates apply too: B2B runs on all plans, but Basic, Grow, and Advanced are capped at 3 active B2B market catalogs, while unlimited catalogs, direct company catalogs, deposits, and partial payments are Plus-only. The full ledger lives in Shopify B2B limitations. Note also that customer accounts are receiving layout updates behind the "Customer account improvements" feature preview, which changes where extension targets render.

What B2B use cases do customer account extensions serve?

Native B2B accounts already cover a baseline: buyers can view order history and company location information, manage saved payment methods, pay invoices, track orders, place reorders by duplicating a past order, and submit and track return requests. As of API 2025-10, company locations can also own store credit accounts that buyers view and spend in customer accounts. Everything a wholesale buyer needs beyond that baseline is extension territory:

This is how B2B Supercharge is delivered: it installs as a Shopify app, your team works in the admin they already know, and your buyers stay in the customer account they already log into. The base platform is free and each module switches on independently.

Should you build extensions or install them?

Scaffolding is one command: shopify app generate extension --template customer_account_ui. A single inline block, an announcement, or an order action is a reasonable custom build for a team that already ships Shopify apps. A full B2B portal is a different scope: teams and roles, approval routing, quoting, batch invoice payment, and ERP sync are products with state, permissions, and back-office integration behind them, not components. The practical decision is usually one custom extension for the one thing unique to your business, and an installed suite for the portal itself. Browse the native gaps and their fixes to see where the line falls for your operation, or start from the Shopify B2B Deep Dive if you are still mapping what native B2B includes.

Last verified 2026-07-12 against Shopify documentation (Customer Account UI Extensions API, 2026-01 stable).

Frequently asked questions