Relative s-link from profile to storefront page issue

Hello!

Relative links inside of customer account ui extension navigating to a storefront page do not work as expected and are instead relative to the customer account.

Dev Example:
<s-link href="/collections/all"> View all products </s-link>
ends up with a url of ‘https://shopify.com/<some_id>/account/pages/<some_uuid>/collections/all’

expected is “https://example.myshopify.com/collections/all"

dev environment running 2026_1 web components.

Hi @Brian_Hunter

From digging into this it looks like this is actually the expected behavior for relative URLs in customer account extensions — they resolve relative to your extension’s route, not the storefront root. The docs on custom protocols explain the three URL schemes available in <s-link>:

  • shopify:customer-account/... — navigates within customer accounts (e.g., orders page)
  • /relative/path — navigates within your extension’s routes
  • extension:<handle>/... — navigates to another extension

To link to a storefront page like /collections/all, you need to use the full absolute URL. You can get the storefront domain from shopify.shop.storefrontUrl:

const storefrontUrl = shopify.shop.storefrontUrl;

// Then in your template:
// <s-link href={`${storefrontUrl}/collections/all`}>Browse all collections</s-link>

Note that as of API version 2024-10, storefrontUrl no longer includes a trailing slash, so you’ll want to include the leading / when appending your path.

Hope that helps — let me know if you run into any issues with this approach!

That is helpful -thank you for clairfying, but unless it is hidden elsewhere, shop is not available in the standardAPI for the customer profile page (and others).

Good point - customerAccountsV2 is an Admin API field, so it’s available from your app backend but not from within a customer account UI extension directly.

That said, if you need the shop ID from within an extension, the Customer Account API does expose a shop query. You can call it via fetch() inside your extension:

const response = await fetch(
  'shopify://customer-account/api/2026-01/graphql.json',
  {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      query: `query { shop { id myshopifyDomain } }`,
    }),
  }
);
const { data } = await response.json();
// data.shop.id => "gid://shopify/Shop/12345678"
// Extract numeric ID:
const shopId = data.shop.id.split('/').pop();
// => "12345678"

That gives you enough to construct https://shopify.com/${shopId}/pages/${extensionUuid}, which as you noted always redirects correctly regardless of custom domain setup.

Ultimately I was looking for a way to build a url to a page on my storefront from the Customer account UI extension:
I am on https://shopify.com/{shopId}/account/profile and I want to create a link to a storefront url such as https://{mydomain}.com/pages/mypage
Thanks to your insights I was able to build this out using the myshopifyDomain property returned from the query. It seems to work on a dev store.
If there is anything else I should include in the url -such as params like country, etc. please let me know.