Mixing JSON-LD and Microdata Schema.org

html, json-ld, microdata, schema.org

Solution

This is not possible like that. If you use the `itemprop` attribute on the `script` element, the property value will be the textContent of `script`. This would be essentially something like `itemprop="{ "@context": "http://schema.org", "@type": "CollegeOrUniversity", "name": "MIT OpenCourseWare" }"`, so the value is the plain text, not JSON-LD (and not interpreted as JSON-LD).

If you don’t want to have the publisher name visible on your page, you could use a `meta` element:

<div itemprop="publisher" itemscope itemtype="http://schema.org/CollegeOrUniversity">
  <meta itemprop="name" content="MIT OpenCourseWare" />
</div>

It would also be possible to use a node identifier (`@id`) for the JSON-LD node and reference this URI in Microdata, but some consumers might not support it (some might not follow references at all, some might only recognize what Schema.org expects for the `publisher` property: `Organization`/`Person`, but not URL):

<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "CollegeOrUniversity",
    "@id": "http://example.com/mit-opencourseware#thing",
    "name": "MIT OpenCourseWare"
}
</script>
<link itemprop="publisher" href="http://example.com/mit-opencourseware#thing" />

Problem

If I have the following markup: ``` <body itemscope="" itemtype="http://schema.org/WebPage"> <h1 itemprop="name">Lecture 12: Graphs, networks, incidence matrices</h1> <p itemprop="description">These video lectures of Professor Gilbert Strang teaching 18.06 were recorded in Fall 1999 and do not correspond precisely to the current edition of the textbook.</p> <div itemprop="publisher" itemscope="" itemtype="http://schema.org/CollegeOrUniversity"> <h4 class="footer">About <span itemprop="name">MIT OpenCourseWare</span></h4> </div> <a itemprop="license" rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/deed.en_US"><img src="/images/cc_by-nc-sa.png" alt="Creative Commons logo with terms BY-NC-SA." /></a> </body> ``` And I want to refactor the publisher property because it's complicated and I don't want to necessarily display it and do this: ``` <body itemscope="" itemtype="http://schema.org/WebPage"> <h1 itemprop="name">Lecture 12: Graphs, networks, incidence matrices</h1> <p itemprop="description">These video lectures of Professor Gilbert Strang teaching 18.06 were recorded in Fall 1999 and do not correspond precisely to the current edition of the textbook.</p> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "CollegeOrUniversity", "name": "MIT OpenCourseWare" } </script> <a itemprop="license" rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/deed.en_US"><img src="/images/cc_by-nc-sa.png" alt="Creative Commons logo with terms BY-NC-SA." /></a> </body> ``` How do I say that the `<script>` block relates to the `itemprop="publisher"` property? I guess the two options are i). adding an `itemprop` attribute to the script tag or ii). adding an `@attribute` to in lieu of `itemprop` to the JSON-LD block. I cannot find documentation on either. Does anyone know the answer?

Original source

Related problems