如何将JSON-LD面包屑模式添加到我的网站导航中以实现SEO目的



编辑:在写问题的过程中,我对这个问题的理解有所提高,但我仍然没有把所有的问题都说清楚,这就是为什么我仍然在问:

今天我被介绍给了面包屑,但我仍然不太确定我是否正确理解它们(我真的很感谢任何能帮助我更好地理解这一点的人(。

我对面包屑的SEO部分感兴趣:我不希望它们显示在我的网站上的任何地方。所以我不想要这样的东西:

home > products > kids > pants

我已经有了一个正常的菜单(示例(:

_________________________________________________________________________________________________
LOGO                     About us      Services      Products     Contact us
_________________________________________________________________________________________________

上面菜单上的每个链接都有子链接。我只关心面包屑的SEO部分在已经存在的(上面(菜单中实现。我说得通吗?

如果是,那么我应该如何具体实施它?实际上,我试着按照本页底部的例子:https://schema.org/BreadcrumbList——JASON-LD。但他们有一个简单的例子如下:

HTML:

<ol>
<li>
<a href="https://example.com/dresses">Dresses</a>
</li>
<li>
<a href="https://example.com/dresses/real">Real Dresses</a>
</li>
</ol>

JSON-LD:

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "BreadcrumbList",
"itemListElement":
[
{
"@type": "ListItem",
"position": 1,
"item":
{
"@id": "https://example.com/dresses",
"name": "Dresses"
}
},
{
"@type": "ListItem",
"position": 2,
"item":
{
"@id": "https://example.com/dresses/real",
"name": "Real Dresses"
}
}
]
}
</script>

据我所知,上面只涵盖了层次结构中的一个"路径",这可能意味着我需要为所有可能的路径重新创建代码?我试着为一个更复杂的虚构菜单这样做,只是为了把它放在这个问题上:

HTML(我的(:

<div class="main-navigation">
<div class="logo"><a href="https://www.haveabiscuit-potter.com/">Have a Biscuit, Potter</a></div>
<!--not a real website -->
<div class="menu-links">
<div class="dropdown">
<a href="https://www.haveabiscuit-potter.com/about-us" class="droptitle">About Us</a>
<div class="dropdown-content">
<a href="https://www.haveabiscuit-potter.com/about-us/our-journey">Our Journey</a>
<a href="https://www.haveabiscuit-potter.com/about-us/part-in-fandom">Our Part in the Fandom</a>
</div>
</div>
<div class="dropdown">
<a href="https://www.haveabiscuit-potter.com/discussion" class="droptitle">Discussion</a>
<div class="dropdown-content">
<a href="https://www.haveabiscuit-potter.com/discussion/harry-needs-biscuit">Why Harry Needs a Biscuit</a>
<a href="https://www.haveabiscuit-potter.com/discussion/dumbledoor-still-good">Dumbledoor is still good: an Introduction</a>
<a href="https://www.haveabiscuit-potter.com/discussion/luna-lovegood-revenclaw">Luna Lovegood: Always a Revenclaw</a>
</div>
</div>
<div class="dropdown">
<a href="https://www.haveabiscuit-potter.com/contact-us" class="droptitle">Contact Us</a>
</div>
</div>
</div>

JSON-LD(我的(-这涵盖了上面菜单中的3个链接。我甚至不确定这是否完全正确,但我们开始了:


<script type="application/ld+json">
{
"@context": "http://schema.org", //or should I change this to https://haveabiscuit-potter.com -?
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://www.haveabiscuit-potter.com",
"name": "Home"
}
},
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://www.haveabiscuit-potter.com/about-us",
"name": "About Us"
}
},
{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "https://www.haveabiscuit-potter.com/about-us/our-journey",
"name": "Our Journey"
}
}
],
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://www.haveabiscuit-potter.com",
"name": "Home"
}
},
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://www.haveabiscuit-potter.com/about-us",
"name": "About Us"
}
},
{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "https://www.haveabiscuit-potter.com/about-us/part-in-fandom",
"name": "Our Part in the Fandom"
}
}
],
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://www.haveabiscuit-potter.com",
"name": "Home"
}
},
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://www.haveabiscuit-potter.com/discussion",
"name": "Discussion"
}
},
{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "https://www.haveabiscuit-potter.com/discussion/dumbledoor-still-good",
"name": "Dumbledoor is Still Good"
}
}
]
}
</script>

//以上内容正确吗?

现在,我们来谈谈我的理解有所提高的部分:看到为每个链接手动编写代码很累,我在谷歌上搜索了"JSON-LD面包屑生成器",我发现了一个更容易的生成器:https://technicalseo.com/tools/schema-markup-generator/

然而,我再次在<script>标签之间只得到一条路径。那么我应该这样生成它吗?输出会是数百个<script>元素,每个元素只覆盖一条路径吗?或者我可以像上面那样把它们放在一起吗?在任何一种情况下,我都应该在我的网站上的每个页面的页脚插入巨大的JSON-LD代码吗?

真的很感谢你读到这里,我真的很感激任何帮助。

我在回答我自己的问题:困惑在于我不知道把面包屑"放"在哪里。我认为它们与导航有关,这就是为什么它们应该出现在所有页面上。

这是不对的,面包屑对每一页都是唯一的(我想这很明显,但一开始我并不喜欢(。

以下是让我意识到这一点的代码:https://search.google.com/structured-data/testing-tool?utm_campaign=devsite&utm_medium=jsonld&utm_source=面包屑

因此,每个页面都应该有与自身及其在网站层次结构中的位置相关的breadcrumb JSON-LD代码。就是这样。现在我要去看看如何为我所有的网站页面批量生成这些面包屑。

很抱歉没有人关心这个问题,但我确实关心。最近,我使用bootstrap 5在我的网站上添加了面包屑,因为让它变得更好的感觉不知怎么地打动了我。一开始,我认为机器人可能足够聪明,可以识别";visaul";breadcrumb在HTML中,所以我首先使用HTML实现。然而,谷歌丰富的结果测试未能识别我的面包屑。就在那时,我意识到谷歌只接受三种结构化数据格式:引用。

祝你的网站繁荣昌盛!

最新更新