schema.org - 如何在 JSON-LD 中使用多个元素

Question

<分区>

Answer 1

@unor 的回答几乎是正确的，但如果你是为谷歌 serp 做的，只将它分成单独的 json block (或图形符号)会得到最好的结果。

假设您要使用 Recipe获得实体google's rich snippet for Recipies在 serps 中你会这样做:

<script type="application/ld+json">
{
  "@context":"https:\/\/schema.org",
  "@type":"Recipe",
  "name":"Example",
  "image":"https:\/\/www.example.com"
}
</script>

在谷歌的 Structed Data Testing Tool你会得到一个预览按钮:

如果您现在想要添加来自其他实体(如面包屑)的其他信息，您必须使用单独的 JSON-LD block ，否则您将无法获得预览按钮。例如

<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "ItemPage",
    "breadcrumb": {
        "@type": "BreadcrumbList"
    },
    "mainEntity": {
        "@type":"Recipe",
        "name":"Example",
        "image":"https:\/\/www.example.com"
    }
}
</script>

有效，但不会显示预览按钮。

但是如果你把它分开，它会显示给单独的实体和预览按钮:

<script type="application/ld+json">
    {
        "@context": "http://schema.org",
        "@type": "ItemPage",
        "breadcrumb": {
            "@type": "BreadcrumbList"
        }
    }
</script>
<script type="application/ld+json">
{
    "@context": "http://schema.org",
        "@type":"Recipe",
        "name":"Example",
        "image":"https:\/\/www.example.com"
    }
}
</script>

Array-Notation 同样适用:

<script type="application/ld+json">
[
    {
        "@context": "http://schema.org",
        "@type": "ItemPage",
        "breadcrumb": {
            "@type": "BreadcrumbList"
        }
    },
    {
        "@context": "http://schema.org",
         "@type":"Recipe",
         "name":"Example",
         "image":"https:\/\/www.example.com"
    }
]
</script>

和图表:

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@graph": 
    [
        {
            "@type": "ItemPage",
            "breadcrumb": {
                "@type": "BreadcrumbList"
            }
        },
        {
            "@type":"Recipe",
            "name":"Example",
            "image":"https:\/\/www.example.com"
        }
    ]
}
</script>

致谢@unor(另见 How do you combine several JSON-LD markups?)