单页网站越来越流行，无需切换页面，所有信息集中在一个页面中展示。但页面内容变长后，访客很难快速跳转到某一特定区域。这时候，就可以使用锚点导航来提升浏览体验。
本文将介绍使用 Blocksy 主题 + Gutenberg 编辑器 实现页面锚点跳转的方法，并通过插件实现菜单高亮功能。
一、什么是锚点导航？
锚点导航是一种点击菜单后，页面平滑滚动到特定内容区域的技术，常用于：
单页网站（One Page Layout）
活动或产品落地页
长内容展示页（如服务流程、公司简介）
二、基础操作：快速实现锚点跳转
1. 创建页面与区块
在 Gutenberg 中创建一个新页面，添加多个内容区块用于模拟页面结构（如“关于我们”、“服务项目”、“联系我们”等）。
2. 设置锚点标识
点击每个标题或区块，右侧边栏 > 高级 > 填写 HTML Anchor 字段（例如：about-us、services）。
3. 创建导航菜单
前往后台：外观 > 菜单，执行以下操作：
创建一个新菜单
添加“自定义链接”，格式为 #锚点名称（如 #about-us）命名链接标题（如“关于我们”）
保存并将菜单设为页眉导航
4. 测试页面跳转效果
访问前台页面，点击菜单项，页面将平滑跳转至对应内容区域。
三、进阶功能：实现菜单高亮效果
问题说明
WordPress 原生并不支持锚点菜单项的“当前项高亮”功能，用户滚动页面时，导航不会自动跟随。
解决方案：使用 Page scroll to id 插件
步骤 1：安装插件
前往后台：插件 > 安装插件
搜索并安装 Page scroll to id 插件，激活后启用
步骤 2：配置插件参数
进入插件设置页面，推荐配置如下：
Highlighted class 设置为：ct-highlight（Blocksy 支持该样式类）
启用：“只允许一个高亮菜单项”
“保持当前项高亮直到下一个出现”
保存设置。
四、最终效果验证
刷新前台页面进行测试：
点击导航菜单，页面平滑跳转至指定区域
滚动浏览时，当前所在的内容区块对应的菜单项自动高亮
这一功能特别适合打造高级感强、交互性高的单页网站或宣传页面。
五、总结
借助 Blocksy 和 Gutenberg 编辑器，结合 Page scroll to id 插件，可以轻松实现：
页面锚点跳转
自定义导航菜单链接
滚动高亮当前菜单项
无需任何代码，快速提升页面交互体验和专业感，非常适合服务介绍页、作品展示页或营销型着陆页使用。