Docusaurus 网站的“id”字段（在“itemListElement.item”中）中的 URL 无效

Question

我们有一个用 Docusaurus“2.0.0-beta.18”制作的网站。我正在通过在 Google Search Console 中检查其页面来改进其 SEO。对于其页面的大部分内容，我意识到有两个非关键问题。这是www.10studio.tech/docs/formula-editor的现场测试截图：

而测试页面中对应的HTML是

<ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList">
  <li class="breadcrumbs__item">
    <a class="breadcrumbs__link" href="/">🏠</a>
  </li>
  <li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item">
    <span class="breadcrumbs__link" itemprop="item name">Formula Editor</span>
    <meta itemprop="position" content="1">
  </li>
  <li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active">
    <span class="breadcrumbs__link" itemprop="item name">Tool</span>
    <meta itemprop="position" content="2">
  </li>
</ul>

有人知道如何解决这个问题吗？

Answer 1

以下是我在面包屑导航实施中发现的一些问题：

1. 面包屑从主页开始，这是正确的，因为它代表了起点。
2. 面包屑路径中缺少“公式编辑器”的链接。
3. 超链接上缺少 itemprop=item 属性，而该属性对于结构化数据标记来说是必需的。
4. itemprop=item 不应添加到面包屑中的最后一项，因为它不是超链接。

以下是正确实现的示例：

<ul class="breadcrumbs" itemscope itemtype="https://schema.org/BreadcrumbList">
  <li class="breadcrumbs__item" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a class="breadcrumbs__link" href="/" itemprop="item">
      <span itemprop="name">🏠</span>
    </a>
    <meta itemprop="position" content="1">
  </li>
  <li class="breadcrumbs__item" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a class="breadcrumbs__link" href="/formula-editor" itemprop="item">
      <span itemprop="name">Formula Editor</span>
    </a>
    <meta itemprop="position" content="2">
  </li>
  <li class="breadcrumbs__item breadcrumbs__item--active" itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <span class="breadcrumbs__link">
      <span itemprop="name">Tool</span>
    </span>
    <meta itemprop="position" content="3">
  </li>
</ul>