If your Shopify store sells in more than one language - using Shopify Markets, Translate & Adapt, or a translation app - your breadcrumbs need to follow the customer’s locale. Breadcrumbs Uncomplicated does that automatically once the underlying menus and collections are translated; the moving parts are few but each lives in a different place.
The four things being translated
- The “Home” label (the leftmost node).
- The menu item labels (e.g., “Men’s Shoes” → “Chaussures pour hommes”).
- The collection names (different from menu labels -
Uomovs the labelMen). - The product title (only shown if you’ve enabled that option).
Each is translated separately in Shopify, in a different place.
Translating “Home”
The leftmost label defaults to “Home” and uses Shopify’s standard translations for that word in every supported locale - “Inicio” in Spanish, “Accueil” in French, and so on - with no setup on your part. The Name to display for root category setting in the Theme Editor lets you change it if you want a brand name or emoji instead, but most stores leave it on the default.
Menu labels vs collection names
If your collection is named Uomo but the menu item pointing at it is labelled Men's, the app picks the right label for the breadcrumb automatically, based on the active locale’s translations. The breadcrumb uses the menu link title by default (Men's, or its translation), and falls back to the collection title (Uomo, or its translation) when the menu link can’t be read. Either way, the trail renders in the shopper’s language as long as that label is translated. For the most consistent wording, translate your menu items in Shopify.
How the breadcrumb is rendered (and what happens if there’s a problem)
The breadcrumb is rendered server-side by default. Server-side rendering (SSR) is how it’s supposed to work: the app walks your menu tree on the server, reads the translated label at each level, and ships the finished trail in the HTML Google sees, with no JavaScript needed. As long as every menu item points at a proper Shopify collection in your category list, SSR carries the whole trail.
If part of your menu can’t be read by the server (because a menu item is linked incorrectly), the storefront falls back to client-side rendering (CSR). CSR is the safety net: it keeps the breadcrumb showing something sensible, but it’s slower and doesn’t carry the same translation guarantees as SSR. CSR is the symptom of a setup problem the Category Advisor is already flagging - don’t rely on it; address the warning.
The collection on the page isn’t in your category list
If you’ve set a specific menu as Top-level category (the recommended setup) and the shopper lands on a collection that menu doesn’t reference, the app has nothing to walk and falls back to CSR.
A Category Advisor warning is being ignored
Several Advisor warnings flag the menu-link shapes that push the breadcrumb onto the CSR fallback:
- Replace pages and blogs with collections. The Advisor’s own help text spells out the consequence: “a partial breadcrumb can still be rendered using (slower) client-side javascript, but … many advanced features (like translations and product count) cannot work.”
- Recreate web-address links as proper resource links. Menu items added as a plain URL behave like page links, with the same downstream effect on rendering.
- Link to collections without filters. Filtered-collection menu items can’t expose the data the breadcrumb needs to translate.
The Advisor surfaces each of these in your app admin with a specific next step (usually a one-line change in Online Store > Navigation). Acting on the warnings keeps your breadcrumbs on the SSR path, which keeps them locale-aware automatically - the app reads Shopify’s translations directly, so a translated menu item shows up in the trail as soon as Translate & Adapt picks it up.
For fully-translated breadcrumbs without surprises, address every Category Advisor warning before going multilingual.
Shopify Markets sub-paths
If your French market lives at /fr/... and your English market at /..., the app detects the locale from the URL prefix and renders the right language without needing extra configuration. The same pattern works for any default-plus-market combination - a Slovak-default store with an English market is one illustration: a visit to /collections/muzi (default-locale Slovak) and a visit to /en/collections/men (English market) both render correctly translated breadcrumbs, because the locale prefix is stripped before the category lookup runs. Whatever your store’s default locale and additional markets, the app handles them the same way.
Translate & Adapt vs paid translation apps
As long as your translations live in Shopify’s native translation API (which both Translate & Adapt and the major paid apps use), the breadcrumbs pick them up automatically. No special integration needed.
This screencast walks through using Shopify’s own Translate & Adapt tool to translate the menu items that your breadcrumbs read from:
What if a translation is missing?
If a collection or menu item hasn’t been translated yet, Shopify shows the default-language value for that node, so the breadcrumb trail still renders end-to-end - just with one node in the default language until you translate it.
Summary
For a multi-language store, the setup is straightforward: translate your menu items (and, as a backstop, your collection names) in Shopify, address every Category Advisor warning, and the breadcrumb renders fully-translated automatically. The client-side fallback is there for cases where an Advisor warning is being ignored - it keeps the breadcrumb showing something sensible, but the real fix is always to act on the warning, not to rely on the fallback.