功能场景指南

How to Translate Shopify Menus & Navigation

How to translate your Shopify menus and navigation — the header, footer, and mobile menus shoppers rely on — without breaking links, layout, or per-market structure.

适用对象Shopify merchants localizing their storefront for multiple markets

主题Menus & Navigation

年份2026

摘要

A repeatable workflow for translating every navigation surface — header, footer, mobile, and breadcrumbs — so each market gets a storefront that reads as native from the first click.

Before a single product, a visitor reads your menu. If the header is still in the source language, the entire localized storefront immediately reads as unfinished.

One untranslated menu label is wrong on every page of your store — the error compounds across hundreds of URLs and quietly erodes trust.

Shopify lets you assign different menus per market, but the translation still has to be produced and wired up correctly — or links point to the wrong-language pages.

安装 Ciwi 联系我们

场景价值

为什么这个翻译场景值得单独处理？

先把这个页面为什么重要讲清楚，再进入翻译范围、错误和执行方法。

这类功能场景不是把几个字段翻译出来就结束了，它通常会直接影响用户是否愿意继续浏览、是否能理解页面信息，以及是否会在结账前流失。

A repeatable workflow for translating every navigation surface — header, footer, mobile, and breadcrumbs — so each market gets a storefront that reads as native from the first click.

How to translate your Shopify menus and navigation — the header, footer, and mobile menus shoppers rely on — without breaking links, layout, or per-market structure.

Navigation is the first thing a shopper touches

Before a single product, a visitor reads your menu. If the header is still in the source language, the entire localized storefront immediately reads as unfinished.

Menus repeat across every page

One untranslated menu label is wrong on every page of your store — the error compounds across hundreds of URLs and quietly erodes trust.

Per-market menus are a Shopify Markets feature

Shopify lets you assign different menus per market, but the translation still has to be produced and wired up correctly — or links point to the wrong-language pages.

翻译范围

这个功能场景应该先翻哪些内容？

按照用户真正会看到、会影响转化和会影响 SEO 的优先级去拆翻译范围。

翻译范围最好按用户实际看到的路径去拆，而不是按后台字段名去拆。先把真正影响理解和转化的内容覆盖掉，再扩到补充模块。

核心层: Header / main menu labels, Footer menu labels, Mobile (drawer) menu, and Mega-menu titles.

重要层: Breadcrumb labels, Collection link titles, and Dropdown submenu items.

Critical优先级: High

Header / main menu labels
Footer menu labels
Mobile (drawer) menu
Mega-menu titles

Important优先级: Medium

Breadcrumb labels
Collection link titles
Dropdown submenu items

Optional优先级: Lower

Menu item descriptions or tooltips
Search bar placeholder text
Announcement bar text

常见错误

这个功能场景最容易踩哪些坑？

这里重点不是语法错误，而是会直接影响体验、SEO 和转化的问题。

下面这些错误之所以重要，不是因为它们语法不对，而是因为它们会让页面显得不可信、流程不连贯，或者直接损失 SEO 与转化。

Translating the header but not the footer or mobile menuHigh

错误示例: Only the main nav is translated; the footer and mobile drawer still show source-language links.

更合适的做法: Translate header, footer, mobile drawer, and breadcrumbs together and assign them per market.

业务影响: A partially translated store that reads as broken the moment shoppers scroll or open the menu on their phone.

Hardcoding menu text in the themeHigh

错误示例: Writing menu labels directly into Liquid or the theme instead of using Shopify navigation objects.

更合适的做法: Keep labels in Shopify navigation lists so they can be translated and assigned per market.

业务影响: Labels that can't be localized without a developer and manual theme edits.

Literal translation that breaks the layoutMedium

错误示例: A one-word label translated into a long phrase that wraps and breaks the header alignment.

更合适的做法: Translate with length limits and test the live header, footer, and mobile layout in each language.

业务影响: Overflowing or misaligned navigation that looks unprofessional and hurts usability.

Links pointing to source-language pagesMedium

错误示例: The translated menu still links to /en/ pages instead of the /fr/ or /de/ equivalents.

更合适的做法: Verify every menu link resolves to the translated version of its target in each market.

业务影响: Shoppers bounce between languages, breaking the localized experience.

方案选择

用哪种方式处理这个场景更合适？

帮助用户在手工处理、翻译 app 和自定义开发之间做选择。

不同团队适合的工作流不一样。关键不是选最强的方案，而是选当前团队能稳定维护、能随着内容更新持续运行的方案。

Manual translation (in-house or freelancer) / Shopify translation app (Translate & Adapt / Ciwi) / Custom build with the Shopify API

Manual translation (in-house or freelancer)

优势

Full control over label wording
Precise fit for short navigation labels
Human judgment on menu hierarchy and ordering

限制

Tedious across many menus
Easy to miss footer and mobile variants
Slow to redo when menu items change

Shopify translation app (Translate & Adapt / Ciwi)

优势

Translates header, footer, and mobile menus in one pass
Length-aware labels keep the nav layout intact
Auto-sync when you add or rename menu items

限制

Recurring subscription cost
Still needs a review pass on brand terms
Per-market menu assignment still needs setup

Custom build with the Shopify API

优势

Programmatic control over navigation and link-list objects
Integrates with a headless or PIM setup
No per-app markup on large stores

限制

Requires development resources
You own the sync and update logic
Slower to ship than an app

执行清单

上线前应该检查哪些点？

把操作顺序和 QA 节点整理成清晰的执行清单，减少漏项。

如果你准备真正上线这个功能场景，最好把下面这些动作当成一个完整的发布清单，而不是零散地做几项设置。

List every navigation surface: header, footer, mobile drawer, breadcrumbs, and any mega-menu.
Export or open your Shopify navigation lists so all labels are in one view.
Decide on a per-market structure — one menu per market, or one translated menu reused across locales.
Build a short glossary for nav-critical terms like Shop, Sale, Support, and category names.
Translate labels with length in mind — short, consistent labels keep the layout from breaking.
Assign the translated menu to the right market in Shopify Markets.
Verify every link resolves to the translated version of its target page, not the source-language page.
Check mobile and footer menus specifically — they are the most commonly forgotten surfaces.

Ciwi

Ciwi 在这个场景里能做什么？

把产品能力翻成用户能理解的工作流收益，而不是只列功能名。

如果你想把这个场景做成可持续更新的流程，而不是一次性处理，下面这些 Ciwi 能力会更有帮助。

Translate header, footer, and mobile menus in one pass
Length-aware labels that keep your nav layout intact
Per-market menu assignment in Shopify Markets
Auto-sync new menu items so navigation never falls behind

安装 Ciwi 联系团队

接下来还应该看哪些相关场景？

这些内容适合继续往下看，形成更完整的 Shopify 多语言工作流。

做完这个页面之后，通常还会有一批相邻场景需要一起处理。继续往下看这些主题，工作流会更完整。

How to Translate Shopify Pages (About, FAQ, Policies)

Translate the destination pages your menu links point to.

How to Translate Shopify Collections

Localize collection titles so nav links and category pages match.

How to Translate Shopify URLs & Slugs

Keep the URL structure behind each menu link localized too.

FAQ

常见问题

覆盖用户在执行这个功能场景时最常问的问题。

Do I need a separate menu for each language?

Not always. You can translate one menu and reuse it, but Shopify Markets lets you assign a different menu per market — use that when the link structure differs, or when one market needs extra items like a local shipping page.

Why is my mobile menu still in English after translation?

Mobile menus are often a separate navigation object from the header, so they get missed. Check that the mobile drawer has its own translated menu assigned to the market.

Will translating menus break my links?

Only if links point to source-language pages. After translating, verify each menu item resolves to the localized version of its target page in that market.

下一步

准备把这个场景真正跑起来了吗？

先从最影响用户体验和转化的 Shopify 场景开始，再把翻译流程扩到更多页面和市场。

安装 Ciwi 联系团队