打造高级导航菜单:blocksy高级菜单完整教程

一个独特而美观的导航菜单能使网站更具吸引力。blocksy高级菜单功能提供了灵活的配置方式,让页面导航模块更丰富、互动性更强。该功能适合博客、企业站、商店等多种场景,能大幅提升整体设计感。

图片[1]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

功能介绍

blocksy高级菜单是一项进阶功能,可在菜单中添加以下内容:

  • 内容区块(Content Block)
  • 图标(Font Awesome 支持)
  • 图片展示位
  • 分类标题
  • 栏目徽章(如 NEW、HOT 等)

它打破传统下拉菜单的局限,可轻松构建多列结构、图文结合的导航样式。

启动功能步骤

进入WordPress后台,依次点击:blocksy> Extensions > Pro Extensions,找到“Advanced Menus”后点击激活按钮。功能生效后即可使用进阶菜单设置。

图片[2]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

菜单编辑与结构设置

进入“外观 > 菜单”,选择目标菜单项(如“Recipes”),点击右侧设置按钮,在弹出窗口中启用高级菜单选项。

图片[3]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

菜单支持三种宽度:

  • Content Width:匹配网站内容区域宽度
  • Full Width:占据整个浏览器宽度
  • Custom Width:自定义像素值控制宽度
图片[4]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

菜单可分为 1 到 6 栏,并对每列单独设定宽度。

图片[5]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

图文混排设计方法

添加一个空链接菜单项(URL 填 #,便于识别),将其设置为“内容区块”类型。选择已有模板作为展示模块,适合放置图片、轮播、推荐内容等。

图片[6]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单
图片[7]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

在分类模块中,可将菜单项设为大标题格式,同时添加图标。支持从 Font Awesome 图标库中选择图标,使标题更具识别度。

图片[8]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单
图片[9]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

分类标识与徽章添加

如果需要突出特定菜单项,如新内容、新品推荐,可添加一个徽章,例如设置为“New”或“Hot”,方便吸引点击。

图片[10]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

子项结构安排

每一栏对应菜单中的一个一级子项。其下可加入多个链接或子模块。例如:

  • 健康饮食(设为标题)
    • 早餐推荐(子链接)
    • 清淡菜谱(子链接)
  • 饮品推荐(图像内容区块)

这样的结构适合信息分类展示,逻辑清晰,视觉友好。

自定义样式

支持调整以下内容:

  • 图标大小
  • 标签字体
  • 行内间距
  • 背景色与悬停颜色

这类配置在视觉一致性与品牌调性匹配中非常有用。

保存与查看效果

完成菜单配置后点击“保存菜单”,然后访问前台页面查看实际效果。导航菜单将以图文结合、多列展示的形式呈现,提升整体观感。

图片[11]-blocksy高级菜单使用教程:打造多栏互动式 WordPress 导航菜单

总结

blocksy高级菜单是网站设计中的一项关键功能。无论是展示复杂分类、推广新内容,还是增强视觉结构,它都能成为重要的设计工具。

最近更新


联系我们
教程看不懂?联系我们为您免费解答!免费助力个人,小企站点!
客服微信
客服微信
电话:020-2206-9892
QQ咨询:1025174874
邮件:info@361sale.com
工作时间:周一至周五,9:30-18:30,节假日休息
© 转载声明
本文作者:贼将鼠胆
THE END
喜欢就支持一下吧
点赞5232 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容