如何在WordPress中隐藏移动菜单（新手指南）
你是否想在WordPress中隐藏移动菜单？大多数WordPress主题会自动将默认导航菜单转换为移动友好菜单。然而，你可能希望对访问你网站的手机或平板电脑用户显示一个不同的菜单。
在本文中，我们将向你展示如何轻松隐藏WordPress的默认移动菜单，以便显示自定义菜单。
方法1：使用插件隐藏移动菜单
隐藏由WordPress主题提供的移动菜单最简单的方法是使用WP Mobile Menu插件。该插件允许你创建一个独特的菜单，然后仅在移动设备上显示它。你还可以隐藏许多主题默认提供的移动菜单。
创建你的移动菜单
首先，你需要创建要在移动设备上显示的导航菜单。为此，请转到WordPress仪表盘中的外观»菜单页面。
在下一屏幕上，你需要为菜单输入一个名称。使用诸如“移动菜单”之类易于识别的名称。然后，你可以选择要添加到移动菜单中的所有文章和页面。
当你对菜单的布局感到满意时，记得单击“保存菜单”按钮以保存更改。
配置插件设置
完成上述步骤后，是时候安装并激活WP Mobile Menu插件了。激活后，前往移动菜单选项以配置插件设置。
在此页面的下方选择是否在屏幕的左侧或右侧显示移动菜单。接下来，在“选择一个菜单”下拉菜单中选择刚刚创建的移动菜单。然后，点击“保存更改”。
你还可以自定义移动菜单的字体选项、标题样式等设置。当你对移动菜单设置满意后，点击“保存更改”。
将移动菜单添加到WordPress
现在，你已经设置好了插件，下一步是告诉WordPress在哪里显示移动菜单。前往外观»菜单。如果尚未选择，打开“选择一个菜单进行编辑”下拉菜单并选择创建的移动菜单。在“菜单设置”下选择“左移动菜单”或“右移动菜单”。然后，点击“保存菜单”。
现在，你可以在移动设备上访问你的网站，查看自定义移动菜单。
故障排除：如何隐藏默认移动菜单
默认情况下，插件会自动隐藏大多数流行WordPress主题使用的菜单元素。然而，如果默认移动菜单仍然出现，你需要在WordPress仪表盘中转到移动菜单选项»常规选项»可见性选项。点击“查找元素”按钮，打开你网站的移动版本。
在弹出窗口中，点击选择要在移动设备上隐藏的内容，例如由WordPress主题提供的菜单。此操作会将内容的CSS类添加到“隐藏元素”字段。点击“保存更改”，主题的菜单将不再出现在移动设备上。
方法2：使用CSS代码隐藏移动菜单
这种方法稍微高级一些，需要向网站添加自定义代码。你可以选择隐藏整个默认移动菜单，或在移动设备上隐藏各个菜单项。
使用CSS隐藏整个移动菜单
首先，你需要找到要修改的元素。去你的网站并将鼠标悬停在导航菜单上，然后右键选择浏览器的检查工具。将浏览器窗口缩小，直到WordPress用移动菜单替代桌面导航菜单。找到移动导航菜单使用的标识符和CSS类。
使用WPCode插件添加自定义代码。安装并激活插件后，前往代码片段»添加片段。在“代码类型”下拉菜单中选择“CSS”。将以下代码粘贴到代码编辑器：.navbar-toggle-wrapper {display:none;}
将.navbar-toggle-wrapper替换为你使用检查工具找到的标识符。
准备发布代码片段时，点击“待激活”切换至“激活”。最后，点击“保存片段”，使代码生效。现在，主题的移动菜单将被隐藏。
使用CSS隐藏特定菜单项
这种方法允许你创建一个导航菜单，并选择性地在移动或桌面设备上显示或隐藏菜单项。首先，前往外观»菜单。点击屏幕右上角的“显示选项”按钮，勾选“CSS类”选项。然后，展开要在移动设备上隐藏的菜单项，在设置中添加.hide-mobile CSS类。对于要在桌面电脑上隐藏的菜单项，添加.hide-desktop CSS类。最后，点击“保存菜单”。
创建新的自定义代码片段，添加以下CSS到WPCode代码编辑器：@media (min-width: 980px){.hide-desktop{display: none !important;}}@media (max-width: 980px){.hide-mobile{display: none !important;}}
发布代码片段后，桌面和移动设备上的菜单项将按你的设置分别显示或隐藏。
我们希望这篇文章能帮助你学会如何轻松地在WordPress中隐藏移动菜单。你可能还想看看我们的最佳拖放WordPress页面生成器以及如何向菜单添加条件逻辑的指南。
