2

We've been using clean data-vocabulary.org markup for our Breadcrumbs for a few years, but the support for that is going away. So we've been trying to switch over to RDFa, but have run into an issue with Google Rich Testing Tool validation.

If we simply copy-paste the code snippet, it validates without any problems. 

<ol vocab="https://schema.org/" typeof="BreadcrumbList" style="list-style:none; padding:0; margin:0;">
   <li property="itemListElement" typeof="ListItem" style="display:inline-block;">
      <a property="item" href="/">
      <span property="name">Index</span></a>
      <meta property="position" content="1">    </li>
    &raquo; <li property="itemListElement" typeof="ListItem" style="display:inline-block;">
    <a property="item" typeof="WebPage"
        href="archive/">
      <span property="name">News</span></a>
    <meta property="position" content="2">   </li>   &raquo;    <li property="itemListElement" typeof="ListItem" style="display:inline-block;">
    <a property="item" typeof="WebPage"
        href="playstation-3/">
      <span property="name">PlayStation 3</span></a>
    <meta property="position" content="3">
   </li>
</ol>

However, if we try to validate the whole URL with the code on-page, the breadcrumbs throw errors by grabbing our other meta-tags, completely outside of the breadcrumb list code.

Does anyone have any clue why this might be happening? All of the breadcrumbs are "WebPage" type, but the errors all occur on the 1st ListItem. Please see image below for example: enter image description here

Is this a code problem? Or google test tool problem? The issue is fixed if I simply make the 1st list item breadcrumb a non-URL/non web page

Improve this question

1 Answer 1

Reset to default
1

This can be a hierarchy problem. I also have faced. I would suggest to use Json/ld format it's JSON based and written inside a scripttag.

A simple example:

<html>
  <head>
    <title>Award Winners</title>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://example.com/books"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "Science Fiction",
        "item": "https://example.com/books/sciencefiction"
      },{
        "@type": "ListItem",
        "position": 3,
        "name": "Award Winners"
      }]
    }
    </script>
  </head>
  <body>
  </body>
</html>

You can find out more on Google Developers

Improve this answer
1
  • Thanks but, we need to use RDFa. We have dynamic PHP content that gets generated within HTML, we don't want to fit into a script.
    – user1556073
    Mar 22, 2020 at 5:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.