你在 Shopify 后台点击了保存菜单，打开在线商店的前台，旧的链接依然原封不动。你刷新了浏览器标签页，依然没有任何改变。
当保存的菜单修改没有在前台出现时，这几乎从来不是因为 Shopify 忽略了你的操作。店铺的前台导航由五个独立层级协同呈现：本地浏览器缓存、当前已发布的主题、页眉设置中分配的菜单、负责绘制导航的第三方应用，或者主题代码冲突。按照顺序逐层排查，几分钟内就能找准症结所在。
Quick answer: why your menu changes don’t show
大多数情况下，修改已经成功保存，但你看到的是本地缓存页面、未发布的草稿主题，或者页眉指向了另一个菜单列表。如果你的菜单是由第三方应用绘制的，则必须在应用内进行修改，而不是在“内容 > 菜单”中。
将你屏幕上的实际情况与下表进行对照：
| 故障症状 | 疑似层级 | 排查位置 |
|---|---|---|
| 仅当前设备显示旧菜单 | 浏览器缓存 | 打开无痕浏览窗口或更换另一台设备查看 |
| 后台预览显示新菜单，线上前台显示旧菜单 | 草稿主题 | 前往在线商店 > 主题检查当前主题 |
| 电脑端菜单已更新，但手机端抽屉依然陈旧 | 页眉或抽屉采用了不同菜单 | 打开当前发布主题的编辑器并检查页眉设置 |
| 修改了“内容 > 菜单”，但底部栏或抽屉没变化 | 应用绘制菜单 | 直接在对应的导航应用管理面板中编辑菜单 |
| 更换主题后菜单彻底消失 | 应用嵌入被关闭 | 进入主题编辑器 > 应用嵌入重新开启应用开关 |
Native Shopify menu vs a menu drawn by an app
在进行排查之前，首先需要厘清前台正在展示哪种类型的导航。Shopify 店铺通常通过两种截然不同的方式呈现菜单。
Shopify 原生菜单在后台的内容 > 菜单中创建和维护。你的主题 Liquid 模板读取该列表并决定如何渲染链接。主菜单通常会在店铺的每个页面上显示，但具体的排版、下拉层级以及移动端抽屉的展现形式完全由当前主题决定。
由应用绘制的菜单则是由集成到主题中的第三方应用脚本呈现（例如屏幕底部固定的标签栏、高度定制的滑动抽屉或多列超级菜单）。这些应用在自身的控制面板中管理链接数据。在 Shopify 原生导航设置中进行的修改，不会自动改变应用菜单展示的内容。
| 对比维度 | Shopify 原生菜单 | 应用绘制的菜单（标签栏、抽屉、超级菜单） |
|---|---|---|
| 编辑位置 | Shopify 后台：内容 > 菜单 | “应用”列表内的专属应用仪表板 |
| 分配位置 | 主题编辑器：页眉 (Header) 分区 | 主题编辑器：应用嵌入或分区区块 |
| 更新机制 | 保存至店铺数据库；通过主题 Liquid 渲染 | 在应用内配置；前端脚本渲染或手动同步 |
如果你的店铺在电脑端使用原生页眉，而在手机端采用第三方应用的滑动抽屉，这属于 separate desktop and mobile menus。在后台编辑电脑端菜单不会对移动端导航产生任何影响。
Start here: hard refresh, private window, another device
先花两分钟排除本地设备的问题。浏览器缓存是保存在你本地电脑上的网页副本，用于加快下次访问时的加载速度。当你更新了菜单后，浏览器可能仍会固执地向你展示本地的旧副本。
首先，执行硬刷新以绕过本地缓存：
- Windows / Chrome / Edge: 按下
Ctrl + Shift + R或Ctrl + F5。 - Mac / Safari / Chrome: 按下
Cmd + Shift + R。
如果旧菜单依然存在，请打开隐身或无痕浏览窗口并访问店铺。无痕窗口不会读取现有的本地缓存和历史 Cookie。
接着，在另一台设备上打开您的店铺，例如使用移动数据（4G/5G）的手机或 Shopify 应用。第二台设备可以排除仅与您自己电脑有关的问题。
正如 Shopify 在其官方主题问题排查指南中所指出的，使用无痕模式、更换设备或使用移动应用可以迅速隔离设备特有的故障。如果在无痕窗口或手机上能正常看到新菜单，说明 Shopify 平台的更新已生效，你只需清理平时所用电脑浏览器的缓存和 Cookie 即可。
如果所有设备和无痕窗口依然显示旧菜单，请停止重复清缓存，进入下一层排查。
Are you editing the live theme?
当无痕窗口依然显示旧菜单时，最常见的原因是误将修改应用在了草稿主题上，而非当前面向顾客发布的主题。
图1：概念示意图（Concept illustration）— Are you editing the live theme?
Preview vs published theme
你的主题库中可以存储多个备用主题，但根据 Shopify 关于发布主题的官方说明，已发布的主题是顾客访问在线商店时看到的唯一主题，并且同一时间只能发布一个主题。
如果你点击了主题库中某个未发布主题的自定义按钮，你所编辑的仅仅是一份草稿。后台的预览窗口之所以能看到新菜单，是因为它读取的是该草稿主题；但公网访问的实际店铺 URL 依然展示未作修改的已发布主题。
确认当前编辑主题的方法：
- 前往在线商店 > 主题。
- 查看顶部标有当前主题的主题卡片。
- 务必点击该卡片上的自定义按钮，而不是下方主题库中的草稿。
App embeds after switching themes
如果你刚刚发布了新主题或升级了主题版本，你的菜单应用可能会突然“失灵”。
许多导航应用通过应用嵌入（app embed）来绘制菜单。根据 Shopify 关于主题结构和应用嵌入的文档，应用嵌入可以在主题编辑器中启用、停用和自定义。但应用嵌入属于各个主题。切换主题后，您需要在新主题中重新启用这些应用。
如果更换主题后底部标签栏或抽屉菜单不见了，请打开已发布主题的编辑器，点击左侧导航栏的应用嵌入图标，将对应菜单应用的开关重新打开。
Is the right menu selected in the Header?
你可能确实在后台成功保存了修改，但当前发布主题的页眉可能指向了一个完全不同的菜单列表。
在 Content > Menus 下，一家店铺可以有多个菜单，例如“Main menu”和“Footer menu”。如果主题页眉指向另一个菜单，在后台编辑“Main menu”不会改变店铺前台。
检查菜单分配的方法：
- 进入在线商店 > 主题，在当前主题上点击自定义。
- 在左侧的页面结构树中，点击页眉 (Header) 分区。
- 在右侧的设置面板中，找到菜单设置项。
- 如果选中的是其他菜单，请选择您编辑过的菜单并点击保存。
Desktop header vs mobile drawer
由于菜单在不同主题上的显示方式各不相同，不同主题开发者的响应式布局机制差异很大。有些主题电脑端和手机端共用一个菜单列表，而有些主题则为电脑端横向栏和手机端抽屉提供了独立的菜单选择项。
如果菜单在电脑端正常更新但在手机端依然陈旧，请检查页眉设置中是否存在名为移动菜单或抽屉菜单的单独字段。在该处重新指派正确菜单，或者参考 make the menu open on mobile 指南排查抽屉未响应的问题。
Check each menu item’s link
如果某个菜单项在店铺中无法正常使用，请检查它的链接。指向已删除或已改为草稿的商品、集合或页面的菜单项，可能把顾客带到不存在的页面。请在后台检查链接，或阅读如何 fix broken links in a navigation menu，确保每个目标都有效。
Did the edit actually save?
Shopify 导航编辑包含两个明确的确认步骤：
- 在 Shopify 后台进入内容 > 菜单（在线商店菜单的查看与修改位置）。
- 点击菜单名称展开其链接列表。
- 在侧滑面板中新增或修改项目后，必须先点击该面板底部的应用更改。
- 随后，必须点击页面右上角或悬浮栏上的主要保存或保存菜单按钮。
如果点击“应用更改”后未点击右上角的“保存菜单”便关闭了标签页，所有修改都会丢失。
在内容 > 菜单页面中刷新浏览器标签页。如果新增项目依然列在其中，说明数据已成功存入 Shopify 数据库。如果项目消失，请按照下方官方视频演示的流程规范操作，并了解如何在 set up menu links in your Shopify store 中正确配置链接：
Server and CDN cache: how long should you wait?
Shopify 官方从未公布过关于 CDN 或服务器端缓存清理的具体时间数值。第三方博客文章给出的推测彼此矛盾，从几分钟到几小时不等。由于这些数字出自外部博客而非平台官方文档，不应被当作通用标准。
如果在检查了已发布主题和页眉设置之后，隐私窗口和第二台设备仍显示旧菜单，请继续检查下面的应用层，而不是干等。
有些论坛帖子建议来回修改菜单别名（handle）或在 theme.liquid 中插入时间戳注释。这些都是未经官方验证的民间偏方，直接在生产环境中修改模板代码存在导致页面崩溃的风险。请优先排查应用层。
When an app draws the menu (tab bar, drawer, mega menu)
如果原生设置均无差错但菜单依然顽固不化，你的前台很可能是由第三方应用接管了导航绘制。
图2：概念示意图（Concept illustration）— When an app draws the menu (tab bar, drawer, mega menu)
基于应用的导航，例如移动标签栏、滑出式抽屉和大型菜单，通常由应用自己的脚本绘制。Helium 关于其 Meteor 菜单应用的文档指出，在 Shopify 的 Navigation 设置中所做的更改不会反映到该应用中，菜单必须在应用内编辑。请查看您所用应用的文档，因为其他应用的运作方式可能不同。
在使用导航应用时，请牢记三条准则：
- 直接在应用内修改： 链接的新增、重命名与排序需在 Shopify“应用”列表中的对应工具后台操作。
- 确保已发布主题的应用嵌入处于开启状态： 如果当前生效的主题中嵌入开关未打开，应用菜单根本无法在店铺展示。
- 手动同步按钮： 如果应用导入或镜像了你的原生 Shopify 菜单，它通常不会实时监听原生变动。例如 Navi+ Mobile Menu 允许嵌入 Shopify 原生菜单，但该副本仅在你于应用内点击 Sync now 时才会拉取最新更改。
Isolate the cause: disable the app, test a free theme
如果你无法确定故障源自主题自身代码还是应用冲突，可以通过副本主题进行安全的隔离测试：
- 复制主题： 在在线商店 > 主题中，点击当前主题旁边的
...并选择复制。 - 关闭应用嵌入： 打开副本主题的主题编辑器，进入应用嵌入，关闭菜单应用并点击预览。如果原生菜单正常显示出了新保存的修改，说明延迟或故障出在应用设置上。Shopify 官方也指出可以临时卸载应用以测试其是否干扰前台。
- 预览干净的免费主题： 如果停用应用后复制的主题仍有问题，请把一个 Shopify 免费主题添加到主题库并点击预览。如果菜单在那里显示正常，原因很可能在您的主主题，而不是 Shopify 本身。
Trade-offs and when not to use these fixes
排查前台导航问题时需要注意一些实际操作代价：
- 清除浏览器缓存和 Cookie： 清除 Cookie 可能会让您退出正在使用的网站。请先在隐私窗口中测试，以免不必要的退出登录。
- 临时卸载应用： 尽管 Shopify 将其作为诊断建议，但卸载应用可能会清除已保存的样式或自定义链接数据。更稳妥的做法是在主题副本中关闭应用嵌入。
- 严禁在正式主题中修改代码： 切勿为了所谓的“刷新缓存”而在已发布主题的
theme.liquid中添加代码。代码格式错误会导致全店无法访问。 - 不要直接发布未配置的主题用于测试： 使用干净主题验证时，仅可使用主题库的预览功能，切勿直接发布到线上运营店铺中。
Where Navi+ fits
如果让原生菜单、应用菜单和主题设置保持一致成了反复出现的麻烦，Navi+ 是管理店铺导航的一种选择。
Navi+ 通过其主题应用嵌入来绘制 Tab Bar、Mobile Menu（抽屉）和 Desktop Mega Menu。您在 Navi+ 应用中编辑标签、图标、徽标和链接，应用的前台脚本会在浏览器中绘制已保存的菜单。保存后，请在隐私窗口中检查结果。
如果您更愿意继续使用 Shopify 原生导航，Navi+ Mobile Menu 可以嵌入您现有的 Shopify 菜单。该副本只有在您于应用中点击 Sync now 时才会刷新，因此由您决定何时生效；在此之前，Content > Menus 中的修改不会同步过来。更多背景请参阅我们的 Shopify menu guide。
如果您希望在一个地方管理 Tab Bar、抽屉和大型菜单，Navi+ 可让您在应用中编辑它们，并通过 Sync now 保留现有的 Shopify 菜单。您可以先在复制的主题上试用。
Action checklist
按照以下八个步骤逐步核对，即可快速定位并解决菜单不更新的异常：
- 无痕窗口排查： 验证旧菜单是否仅存在于当前浏览器的本地缓存中。
- 更换设备测试： 断开本地 Wi-Fi，用手机蜂窝移动网络加载店铺网址。
- 核实已发布主题： 确认在在线商店 > 主题中点击自定义的是当前主题。
- 检查页眉菜单绑定： 确保线上主题的页眉分区正确指向了已修改的菜单列表。
- 确认保存操作完成： 检查内容 > 菜单，确认先后点击了应用更改与保存菜单。
- 验证目标链接状态： 确保修改的菜单项所指向的页面、商品或系列处于上架且未删除状态。
- 确认应用嵌入处于开启： 在当前主题编辑器中确认对应菜单应用的应用嵌入已启用。
- 在应用内编辑或同步： 若采用应用菜单，请在应用面板修改或点击 Sync now。
When to contact support and what to send
如果完成检查清单后菜单仍未更新，请联系支持。Shopify 的主题故障排除指南把联系支持列为一般检查之后的最后一步，这样您可以说明已经排除了哪些原因。
在初次提交工单时，附带以下关键信息：
- 已发布主题名称： 在在线商店 > 主题顶部卡片显示的完整主题名称。
- 编辑的菜单列表名称： 在内容 > 菜单中的确切菜单标题以及未能显示的链接名称。
- 无痕窗口对比截图： 后台菜单配置截图与无痕窗口下前台展示截图的直观对比。
- 设备与浏览器环境： 你当前所使用的操作系统与浏览器版本。
- 正在运行的导航应用： 店铺中安装的所有菜单、标签栏或超级菜单应用名称。
- 隔离测试结果： 在主题副本中关闭应用嵌入或预览免费官方主题时观察到的具体现象。
若异常仅出现在由第三方应用绘制的菜单中，请直接通过 Shopify App Store 联系该应用的专属支持团队。
FAQ
Do I need to clear my cache to see menu changes?
建议首先尝试在无痕窗口或另一台设备上查看。Shopify 官方建议仅在确认问题仅存在于本机时，才清除浏览器的缓存和 Cookie。
How long does it take for menu changes to appear?
Shopify 官方未发布过缓存传播的具体时间指标。如果在核实了当前发布主题和页眉设置后，无痕窗口和移动设备依然显示旧内容，应深入检查主题与应用配置，而非持续等待。
Why did my menu change in the preview but not on the live store?
你很可能在编辑主题库中的某款草稿主题。顾客只能浏览已发布的主题，并且 Shopify 规定同一时间只能激活发布一款主题。
I edited Content > Menus but my app’s menu didn’t change. Why?
由应用绘制的菜单读取的是应用自身内部的数据。修改 Shopify 原生导航设置不会自动变更第三方应用菜单。在 Navi+ 中，嵌入的原生菜单需在点击 Sync now 后才会同步更新。
My menu disappeared after I switched themes.
应用嵌入不会在更换或发布新主题后自动继承启用状态。你必须进入新主题的主题编辑器，在应用嵌入设置中重新开启该应用。
Sources
- Shopify Help Center: Add, remove, or edit menu items in your online store — 在“内容 > 菜单”中编辑菜单项及完整保存步骤。
- Shopify Help Center: Understanding navigation — 主题呈现导航菜单的方式以及主菜单的全店显示特性。
- Shopify Help Center: Publishing themes — 已发布主题的公开可见性及单主题激活限制规范。
- Shopify Help Center: Troubleshooting your online store theme — 主题故障排除通用指南、浏览器缓存应对及免费主题隔离法。
- Shopify Help Center: App embeds and theme structure — 跨主题切换时应用嵌入的激活与再激活流程。
- Helium Help Center: Common issues & fixes — 原生导航设置与应用菜单解耦的技术背景及脚本加载说明。
- Shop Theme Detector: How to delete your cache on Shopify — 探讨各第三方博客对服务器端缓存刷新时间推测不一的原因分析。
探索更多主题
本指南链接到一系列专题文章——逐一深入了解。