简体   繁体   中英

HTML5 Microdata - itemref to multiple itemscope's

Is it possible to use itemref to link to more than 1 itemscope. Here's the scenario:

I have a few blog posts on a page, each blog post has the same person and organization meta info. Rather than including all the meta info for the person and the organisation in each blog post, can that info be referenced to instead? I can do it with one reference, eg person:

<div id="person" itemscope itemprop="author" itemtype="http://schema.org/Person">
  <span itemprop="name">Joe Blogs</span>
</div>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>

  <div itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
    <span itemprop="name">Organization</span>
    <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
      <meta itemprop="url" content="http://example.com/image.jpg">
      <meta itemprop="width" content="600">
      <meta itemprop="height" content="60">
    </div>
  </div>
</article>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>

  <div itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
    <span itemprop="name">Organization</span>
    <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
      <meta itemprop="url" content="http://example.com/image.jpg">
      <meta itemprop="width" content="600">
      <meta itemprop="height" content="60">
    </div>
  </div>
</article>

But haven't been able to do it with 2 references:

<div id="person" itemscope itemprop="author" itemtype="http://schema.org/Person">
  <span itemprop="name">Joe Blogs</span>
</div>

<div id="organization" itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
  <span itemprop="name">Organization</span>
  <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="600">
    <meta itemprop="height" content="60">
  </div>
</div>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person" itemref="organization">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>
</article>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person" itemref="organization">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>
</article>

Or:

<div id="person" itemscope itemprop="author" itemtype="http://schema.org/Person">
  <span itemprop="name">Joe Blogs</span>
</div>

<div id="organization" itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
  <span itemprop="name">Organization</span>
  <div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="600">
    <meta itemprop="height" content="60">
  </div>
</div>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>

  <meta itemref="organization" itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
</article>

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person">
  <a href="/" itemprop="mainEntityOfPage"><h1 itemprop="headline">Title</h1></a>
  <time datetime="2016-01-01 12:00:00" itemprop="datePublished">1st Jan</time>
  <time datetime="2016-01-02 12:00:00" itemprop="dateModified">2nd Jan</time>

  <div itemprop="image" itemscope itemtype="https://schema.org/ImageObject">
    <img src="image.jpg">
    <meta itemprop="url" content="http://example.com/image.jpg">
    <meta itemprop="width" content="400">
    <meta itemprop="height" content="400">
  </div>

  <meta itemref="organization" itemscope itemprop="publisher" itemtype="http://schema.org/Organization">
</article>

Running both of these through https://developers.google.com/structured-data/testing-tool/ gives errors. Although at least the third example shows that the organization reference is being made.

The itemref attribute can¹ take several values, separated by space.

So instead of

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person" itemref="organization">

use

<article itemscope itemtype="http://schema.org/BlogPosting" itemref="person organization">

¹ ref. WHATWG spec: itemref / W3C Note: itemref

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM