导航栏

在页面加入面包屑路径、控制显示位置，并让可见导航路径与 breadcrumb schema 保持一致。

概览

导航栏 可帮助访客理解当前页面位于网站结构中的哪个位置，也能让搜索引擎更清楚地理解层级关系。

你可以在 Airygen SEO -> 设置 -> 导航栏 进行设置。

这个模块特别适合具有父级页面、分类汇总页、搜索结果页，或内容层级较深且需要让用户回溯的网站。

输出方式

导航栏 同时支持手动放置与自动插入内容。

手动输出

当你希望自行决定显示位置时，请开启 启用手动导航栏输出。

  • 当你希望把面包屑放进主题模板时，请使用 模板函数。
  • 当你希望把面包屑放进文章内容、简码区块或其他支持简码的区域时，请使用 简码。
  • 当你希望在区块编辑器中以可视方式放置面包屑时，请使用 区块。

模板函数：

<?php if ( function_exists( 'airygen_the_breadcrumbs' ) ) { airygen_the_breadcrumbs(); } ?>

简码：

[airygen_breadcrumbs]

区块：

<!-- wp:airygen/breadcrumb /-->

自动插入

当你希望 Airygen SEO 自动把面包屑插入主要内容区时，请开启 启用自动导航栏插入。

  • 插入位置 可让你选择将面包屑放在 内容前 或 内容后。
  • 当你希望大量文章都使用一致的面包屑位置时，自动插入会更方便。
  • 当你需要在主题或页面布局中精准控制面包屑位置时，手动放置会更适合。

如果你同时启用手动输出与自动插入，请务必仔细检查正式页面，避免面包屑重复出现两次。

设置

此页面分为 设置、布局 与 预览。

设置 分页

这个分页用来决定面包屑如何显示，以及路径中包含哪些项目。

输出控制

  • 启用手动导航栏输出 会开启面包屑使用的 模板函数、简码 与 区块 片段。
  • 启用自动导航栏插入 会按你选择的位置，把面包屑插入文章内容中。
  • 插入位置 用来控制自动输出出现在 内容前 或 内容后。

层级

这些控制项会决定面包屑链中显示多少结构信息。

  • 显示首页链接 会让路径从首页标签与首页网址开始。
  • 在归档页显示文章页链接 会在网站使用固定文章页时，于归档项目前插入文章页链接。
  • 显示上级页面 会为页面与层级式自定义文章类型加入父级页面。
  • 隐藏分类法上级项目 会在你希望路径更精简时，移除分类与分类法路径中的父级项目。
  • 显示当前页面 会把当前页面加入为最后一个面包屑项目，也会影响 JSON-LD 导航栏清单。
  • 显示分页 会在分页归档页后方附加当前页码。
  • 分隔符号 用来定义面包屑项目之间显示的符号。
  • 前缀 可在面包屑前方加入文字，例如简短的“你当前在这里”提示。

标签

这些字段可让面包屑文案更符合你的网站语气。

  • 首页标签 可更改首页面包屑的文字。
  • 归档标签 可更改归档页使用的标签文字。
  • 搜索结果标签 可更改搜索结果页显示的标签文字。
  • 404 标签 可更改找不到页面时显示的文案。

布局 分页

这个分页用来调整面包屑容器与路径文字的样式。

容器样式

  • 边框宽度 可调整面包屑容器边框粗细。
  • 边框颜色 可调整边框颜色。
  • 内距 可调整路径周围的内距。
  • 容器背景色 可调整面包屑后方背景色。

路径样式

  • 字号 可调整面包屑文字大小。
  • 文字颜色 可调整非链接文字颜色。
  • 链接颜色 可调整面包屑链接颜色。
  • 链接下划线 可开启或关闭链接下划线。

如何使用

  1. 打开 Airygen SEO -> 设置 -> 导航栏。
  2. 在 设置 分页中，决定你要使用 启用手动导航栏输出、启用自动导航栏插入，或只保留一种主要输出方式。
  3. 如果你要在主题层级放置面包屑，请开启 启用手动导航栏输出，并把 模板函数 片段贴到面包屑应出现的模板位置。
  4. 如果你要在编辑器层级放置面包屑，请保持 启用手动导航栏输出 为开启，并在内容区插入 简码 或 区块。
  5. 如果你要自动放置面包屑，请开启 启用自动导航栏插入，并选择最适合内容版面的 插入位置。
  6. 在 层级 中，设置是否显示首页链接、归档页文章链接、父级页面、当前页面与分页信息。
  7. 设置容易阅读的 分隔符号 与可选的 前缀，让面包屑更符合网站语气。
  8. 在 标签 中，自定义首页、归档页、搜索与 404 页面的文字。
  9. 打开 布局，调整容器边框、内距、颜色与路径文字样式，让面包屑更符合主题设计。
  10. 打开 预览，在 笔记本电脑、平板电脑 与 手机 间切换，并在保存前检查示例路径。
  11. 保存设置后，在正式网站上测试文章页、归档页、搜索页与 404 页。

保存后请在正式网站确认以下项目：

  • 每个位置的面包屑只出现一次。
  • 可见路径符合你希望用户理解的页面层级。
  • 只有在开启 显示当前页面 时，当前页面才会显示在路径中。
  • 主题 CSS 载入后，正式页面样式仍然正确。

预览与正式输出

预览 分页会按照你当前的样式设置显示简化版的面包屑示例。

  • 预览包含 笔记本电脑、平板电脑 与 手机 设备切换器。
  • 预览会反映你当前的边框、间距、颜色与文字设置。
  • 页面也会显示生成的 HTML 与 CSS 示例，方便你检查示例结构。

正式网站看起来仍可能与预览不同。

  • 真正的面包屑路径会依据实际页面类型、父级结构、分类法路径，以及搜索或 404 情境而改变。
  • 最终外观仍可能受到启用中的主题、自定义 CSS 与周边页面版型影响。
  • 如果你同时使用手动放置与自动插入，正式页面可能会出现重复路径，即使预览看起来很干净。

保存后，请实际检查真实文章、真实归档页、搜索结果页与 404 页，确认前台可见路径与 schema 行为正确。

SEO 效益

面包屑能让搜索引擎更容易理解页面层级，也能帮助访客从较深层的内容快速回到上层区域，而不必依赖浏览器返回键。

它也让从搜索进入的网站页面更容易被探索，尤其适合具有分类树、归档页与多层内容路径的网站。

使用场景

具有多层主题结构的内容网站

调整前：网站有分类、子分类与长篇系列文章，但读者无法清楚回到更上层的主题页。

调整后：导航栏 显示回到上层区域的路径，让文章之间的关系更容易理解，也更方便导航。

拥有深层商品分类的 WooCommerce 或目录型网站

调整前：用户从搜索进入较深层的商品页或分类页，却无法立刻理解该页在整体目录中的位置。

调整后：导航栏 持续显示分类路径，让用户能直接回到更大的商品集合，而不必重新开始浏览。

想为多个客户网站统一结构的代理商

调整前：每个网站都用不同方式处理面包屑位置，导致导航与 schema 行为很难保持一致。

调整后：导航栏 让代理商可以在同一个地方管理位置、标签与布局，同时按每个网站选择手动输出或自动插入。

常见问题

我该用手动输出还是自动插入？

当你需要在模板或内容区精准控制位置时，请使用手动输出。当你希望大量文章都固定插入同一位置时，请使用自动插入。

如果面包屑出现两次，我该怎么办？

请检查你是否同时开启 启用自动导航栏插入，又在同一页放入 简码、区块 或 模板函数。该位置只保留你真正需要的一种输出方式即可。

为什么预览和正式页面不完全一样？

预览只是你当前样式设置的简化呈现。正式输出仍会受到真实页面层级、当前查询条件与主题 CSS 影响。