user10490172
user10490172

Reputation: 21

Correct syntax & usage of SiteNavigationElement in JSON-LD

Now, after reading several articles online, I finally got confused. I have a main navigation with multiple sub categories. Found 2 examples then I stopped b/c I am confused.

Example 1:

{
      "@context":"http://schema.org",
      "@type":"ItemList",
      "itemListElement":[
        {
          "@type": "SiteNavigationElement",
          "position": 1,
          "name": "Sign Up",
          "description": "Create your example profile.",
          "url":"https://example.com"
        },
        {
          "@type": "SiteNavigationElement",
          "position": 2,
          "name": "About us",
          "description": "Read more about example company",
          "url":"https://example.com/about"
        },
        {......

Example 2:

{
        "@context": "https://schema.org",
        "@graph": 
        [
          {
              "@context": "https://schema.org",
              "@type":"SiteNavigationElement",
              "@id":"#table-of-contents",
              "name": "Section 1",
              "url": "https://www.example.com/page#toc-1"
          },
          {
              "@context": "https://schema.org",
              "@type":"SiteNavigationElement",
              "@id":"#table-of-contents",
              "name": "Section 2",
              "url": "https://www.example.com/page#toc-2"
          },
          {....

What is the difference between these 2 usage? They are both valid but couldn't decide which one to adopt.

Upvotes: 2

Views: 1716

Answers (1)

unor
unor

Reputation: 96697

Example 1 consists of an ItemList with two SiteNavigationElement elements.
Example 2 consists of two SiteNavigationElement elements (and both elements are the same, because they have the same @id value).

I would say neither is correct for what you intend to convey.

The SiteNavigationElement type represents the whole navigation, not a single navigation link (most likely).

{
  "@context": "http://schema.org",
  "@type": "SiteNavigationElement",
  "name": "Main navigation"
}

If you want to provide data about each navigation link, you could consider using an ItemList in addition, where each link could be a WebPage (specified with itemListElement).

{
  "@context":"http://schema.org",
  "@type": ["SiteNavigationElement", "ItemList"],
  "name": "Main navigation",
  "itemListElement": [
    {"@type": "WebPage"},
    {"@type": "WebPage"},
    {"@type": "WebPage"}
  ]
}

Upvotes: 2

Related Questions