Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

在之前的文章中,我们详细探讨了 Astra 主题付费版与模板导入的区别。本期文章,我们将深入解析 Astra 主题的菜单设置。对于每一个网站来说,菜单都是至关重要的导航工具,不仅决定了用户的浏览体验,还直接影响到网站的整体布局和美观度。通过 Astra 主题的强大功能,你可以轻松设置出既美观又实用的超级菜单,提升你的网站质感和用户体验。

在之前的各类主题我们都讲述了菜单,菜单的设置都是差不多的,就一个添加的page(页面),第二个是自定义链接,第三个则是你想加入比如产品的分类或者其他项目

步骤:网站后端→Appearance→Menus

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

为什么页面显示Elementor,因为是显示这个页面是有Elementor编辑的,没有显示的则为默认编辑器

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)
Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

还有些页面会显示page,这就是设定的主页面,比如主页(home),博客(blog),商店(shop),购物车(cart),结账(checkout)

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如果你不想显示的这么单一,想要更美观更独特的效果,如下图

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)
Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)
Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

各种各样的效果,是不是比普通效果好多了,接下来我来教你怎么设置超级菜单

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如上图,我们在需要需要设置的二级菜单的主导航名称下开启超级菜单选项,链接可以设置为\或者#

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如上图,先打开这个超级菜单按钮哦

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

然后选择合适展示宽度,你可以选择全屏宽度或者菜单宽度,和自定义宽度,非常的智能

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

然后你可以设置菜单背景的颜色,或者放入背景图片,根据实际情况调整

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

当然还有标题和文本以及链接的颜色调整

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

最后点击保持,你就完成了第一步

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

然后我们需要设置超级菜单的标题,也就是第一个,你可以理解为标题

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

然后链接地址\或者#,然后在点击超级菜单

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

把他设置为标题,这样会比较好区分它和他的子项。同时禁用链接,如果有链接,则在前端鼠标触碰会有动态效果,如果只是展示的话,就禁用链接

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

还有一个分隔符的颜色,这人会更容易区分

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

当然还有一种分隔符的设置方式,但超级菜单这种的会比较简单,而且自适应

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如上图,通过自定义链接的形式,但这种不好控制长度,所以这只是一种参考

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

然后它的子项目就正常添加就行了,无需在动超级菜单,是不是非常的简单

我们讲述另一种超级菜单的设置

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)
Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

我们看到前端的效果是不显示标题的,你看到可能会有疑问,其实就在超级菜单的哪里隐藏了标题

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如下图,图片则是在超级菜单的位置加入了图片,其他都是一样的

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

如下图,我们需要一步步设置,才能选中图片,否则是没有的

Astra 主题菜单设置详解:从基础到超级菜单的全面指南(04)

总结:
通过本篇文章的详细讲解,相信你已经掌握了如何在 Astra 主题中设置超级菜单的方法。菜单的设计不仅仅是简单的导航设置,更是提升用户体验和网站专业度的重要一环。下一期,我们将继续探讨 Astra 主题的更多功能,包括幻灯片和其他细节设置,帮助你打造更加出色的网站。


联系我们
文章看不懂?联系我们为您免费解答!免费助力个人,小企站点!
电话:020-2206-9892
QQ咨询:1025174874
邮件:info@361sale.com
工作时间:周一至周五,9:30-18:30,节假日休息
发布者:光子波动,转转请注明出处:https://www.361sale.com/16792/

(1)
上一篇 2024年 8月 15日 上午11:25
下一篇 2024年 8月 15日 下午1:52

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

联系我们

020-2206-9892

QQ咨询:1025174874

邮件:info@361sale.com

工作时间:周一至周五,9:30-18:30,节假日休息

客服微信
为方便全球用户注册登录,我们已取消电话登录功能。如遇登录问题,请联系客服协助绑定邮箱。