Elementor中构建一个可行的、风格化的导航菜单,而无需购买Pro。Elementor自己的菜单小部件仅限Pro,但免费的Master Addons Nav Menu小部件将任何WordPress菜单拉入编辑器,从面板中对其进行样式设计,然后折叠到小屏幕上的汉堡包切换。
下:为什么核心Elementor会留下空白,填补空白的三种方法,构建本身,以及自由停止的地方最后那部分比平常更重要,因为一种流行的移动模式不是免费的,大多数指南都说不然。
为什么 Elementor free 没有菜单小部件
Elementor的免费插件, 运送了数十个布局和内容小部件, 并且无法在页面或模板中放置WordPress导航菜单, 执行此操作的小部件, 最初称为Nav菜单, 现在称为WordPress菜单小部件, 仅限Pro。 Elementor 自己的文档 确认了。
Appearance > Menus 下仍然可以自行构建菜单,WordPress 将其注册得很好,差距在设计端:core Elementor 没有什么可以把该菜单掉进去的,所以无论你的主题决定打印它在哪里,你都会被困住。
Menu-ready 主题的简单站点上,那可能就足够了,当你想要自定义头、粘性条、你控制的汉堡包切换或巨型菜单的那一刻,仅靠免费的 Elementor 就无法到达那里。
多年来,命名发生了变化,这增加了混乱。旧教程说 Nav 菜单,新教程说 WordPress 菜单。许可证从未改变。它一直需要 Pro。
三种无需 Pro 即可添加导航菜单的方法
三种实物期权,每种期权的交易方式在造型和移动行为上都不同。
| 方法 | 成本 | 编辑造型 | 移动 | 最好的 |
|---|---|---|---|---|
| 主题菜单位置 | 免费的 | 没有,主题控制它 | 取决于主题 | 菜单就绪主题的简单网站 |
| 主插件导航菜单小部件 | 免费的 | 完整,来自面板 | 汉堡拨动电话 | 没有 Pro 的自定义标头 |
| 主插件巨型菜单 | 免费的 | 满满的 | 折叠到切换 | 多列面板,大导航 |
| Elementor Pro 菜单小部件 | 付费许可证 | 满满的 | 包括画布外 | Elementor Pro 上已有网站 |
主题菜单位置。 每个主题都注册至少一个菜单区域。分配您的菜单,它的工作插件为零。您无法从 Elementor 控制它的外观,并且移动行为是主题作者构建的任何内容。如果您的主题菜单看起来已经正确并且崩溃得很干净,那么确实没有理由在上面添加小部件。
主插件导航菜单小部件。 没有 Pro 许可证的 Elementor 本机选项。放弃 导航菜单小部件 进入任何模板,将其指向"外观">"菜单"中的菜单,以及面板上的样式颜色、间距、子菜单和移动切换。
主插件巨型菜单. Mega Menu 扩展程序对于类别较多的站点, 构建多列面板, 同时也是免费的, 它是一个单独的工具, 有自己的演练: 如何在没有 Pro 的情况下在 Elementor 中构建巨型菜单.
元素专业版。 如果您已经拥有它,它的菜单小部件和主题生成器会原生执行此操作,您应该使用它们。为一项作业运行两个插件只会增加权重。

构建菜单,开始完成
Wp-admin 和 Elementor 编辑器中进行整个构建,没有代码片段,没有子主题编辑,在开始之前,检查你的主题还没有打印自己的标头,因为两个堆叠的标头是人们在这里最常见的混乱。
1步:注册菜单
到外观>菜单,创建一个菜单,添加你的页面和链接,并给它起一个你将在六个月后识别的名字,这是简单的WordPress,没有插件特有的,WordPress有一个 菜单屏幕指南 如果您以前没有建造过。

2步:创建头部模板
免费打开 主插件主题生成器 header 并添加一个新模板, 类型设置为 Header, 这是你的菜单所住的容器, 它让你取代主题的 header 而不是与之战斗。

3步:添加导航菜单小部件并选择菜单
Elementor面板中搜索“Nav菜单”, 拖入页眉, 在小部件设置中, 从选择菜单下拉选择您在步骤一中构建的菜单, 然后设置布局。水平适合一个标准页眉;垂直适合一个侧边栏, 并为您提供正常, 切换,手风琴和侧边子类型。
Layout是按设备设置的,手机默认使用汉堡包切换,所以桌面菜单在那里崩溃,没有额外的设置。

第 4 步:设计它
Style标签页中都是字体、颜色、间距、悬停状态和子菜单行为,不需要自定义CSS,这是Elementor根本做不到的部分核心,这也是添加小部件而不是使用主题菜单位置的全部原因。

5步:发布并分配
保存模板并将其分配给整个站点。在唯一可用的显示条件的免费层上,当您想要一个头到处时,这很好。

6步:在前端检查一下
Load站点,确认一个头部是渲染,而不是两个,如果你也看到主题的菜单,请在主题自己的自定义设置中禁用它,而不是用CSS隐藏它。

让它在移动设备上运行
只在桌面上工作的菜单没有完成。在手机上,Nav Menu 小部件会折叠成汉堡包切换,并且该切换是免费的,包括其图标、活动状态和样式。
Toggle是专为键盘和屏幕阅读器使用而构建的,而不是仅用于鼠标。Enter和Space打开它,Esc关闭它。那值得检查你安装的任何菜单小部件,因为许多是由键盘无法到达的div构建的。
明确什么是免费移动菜单:折叠面板在切换下方展开到位,非常适合中短菜单,从侧面滑入的完整画布外面板是 Pro 功能,下一节将介绍。
Test on a real phone而不是浏览器设备工具栏。轻按目标、转换速度以及面板在外部轻按上是否关闭,在触摸屏上的行为都与在调整大小的桌面窗口中的行为不同。检查图标是否改变状态,以便明显菜单打开,并且一个子菜单项可以用一个拇指到达。

免费版本停止的地方
两个限制,在您围绕它们进行设计之前而不是之后,两者都值得了解。
画布外和汉堡布局选择是 Pro。 布局控件免费提供水平和垂直,汉堡标有 Pro。手机开箱即用带有默认类型的汉堡,但选择汉堡用于其他宽度,或切换到弹出窗口或 Offcanvas 类型,需要 Pro。因此,"“off-canvas menu"通常意味着的滑动侧面板是这里的付费功能。通往类似内容的免费路径是垂直布局的侧面类型,它将菜单停放在页面的一侧,或者移动的标准汉堡切换。
主题构建器定位是一条规则。 Theme Builder 免费恰好保存一个显示条件: 整个站点。如果您想要一个头部到处都很好。不足以满足登陆页面上的不同头部, 登录会员的不同菜单, 或范围为一种帖子类型的头部。那些需要Pro。Our 显示条件细分 通过插件源跟踪该行,以及 免费主题构建器指南 涵盖该层的其余部分。

Elementor Pro,你已经拥有了,这种解决方法都不适用,而且如果你的主题菜单位置足够,那么plain Appearance > 完全没有插件的菜单是正确的调用,一旦主题默认停止就足够了,就添加一个插件 小部件和扩展名目录 如果您正在权衡整个插件,请列出还有哪些内容可以免费提供。
如果标头需要一个您继续手动重建的部分,则 小部件生成器 让您将其作为真实的小部件创作一次。它位于 Pro 中,并且 定价页面 列出层数。
常见问题
Elementor 有免费的菜单小部件吗?
不是来自 Elementor 本身。核心插件没有菜单小部件;该插件仅随 Pro 一起提供。免费扩展名 Master Addons 添加了自己的 Nav 菜单小部件,因此您无需许可证即可放置和设置真正的导航菜单。
您可以在没有 Pro 的 Elementor 中创建导航菜单吗?
是。按正常方式注册外观>菜单下的菜单,然后使用免费插件将一个Nav菜单小部件放入头模板中并从面板中对其进行样式设置。仅Elementor free无法放置或样式设置菜单,因此您需要主题菜单位置或插件小部件。
如何在 Elementor 中免费添加移动汉堡菜单?
Master Addons Nav Menu 小部件添加到您的头部模板, 选择您的菜单, 默认情况下它会折叠到手机上的汉堡包切换, 切换,它的图标和它的样式都是免费的, 面板在切换下就地展开。
Master Addons 中的画布外菜单免费吗?
No。Off-canvas是汉堡布局内部的三种类型之一,选择该布局或其Popup和Offcanvas类型需要Master Addons Pro。免费上您将获得水平和垂直布局加上手机上默认的汉堡拨动,如果您想要侧面锚定菜单而无需付费,则垂直布局的侧面类型是最接近的免费等价物。
如何免费在 Elementor 中创建大型菜单?
Master Addons包括一个免费的Mega菜单扩展,它可以构建多列面板并在移动设备上崩溃,它与标准的Nav菜单小部件分开,专为具有类别,列或促销内容的更大导航而构建。
为什么我的 Elementor nav 菜单没有显示?
通常是一个未分配的菜单。检查一个菜单实际上是在小部件设置中选择的,而不仅仅是在"外观">"菜单"下创建。然后确认标题模板已分配给主题生成器中的整个站点,并且没有主题标题仍然处于活动状态并与之重叠。
我需要 Master Addons Pro 吗?还是菜单免费?
Nav Menu 小部件是免费的,包括造型、子菜单、每设备布局和手机上的汉堡包切换。Pro 添加了任何宽度的汉堡包布局及其弹出式和画布外类型,以及超出单个整个站点规则的主题生成器条件。
接下来该怎么办
用水平布局构建头部,然后在设计其他任何东西之前将其加载到自己的手机上,大多数菜单问题是移动问题,它们会在十秒钟内出现在真实设备上。
如果菜单需要多列面板,则 巨型菜单指南 从那里接。 Nav 菜单小部件页面 与 Elementor Pro 的菜单小部件进行比较,以及 导航菜单文档 列出每个控件。
