web-dev-qa-db-ja.com

HTML5 Microdata-別のitemscopeへのitemref（すべてのブログを含むCollectionPage）

Googleの構造化テストツールでは、これらはすべて別個のインスタンスであることが示されています。私はそれらを互いにリストさせようとしています。

これは私が今持っているものです：

<section class="primary content-area" itemscope itemtype="http://schema.org/CollectionPage">
    <meta itemprop="name headline" content="Stepanie Schaefer" />
    <div itemid="http://www.cheapflights.com/news/author/stephanieschaefer/" itemscope itemtype="http://schema.org/Person">
       <h1 itemprop="headline"><span itemprop="name">Stephanie Schaefer</span></h1>
       <p itemprop="description">Stephanie is a Boston native who loves to find ways to escape New England winters. She’s thrown a coin in the Trevi Fountain, sipped wine on a vineyard in Northern Spain and swam in the Mediterranean Sea. Although she hasn’t been everywhere, it’s definitely on her list.</p>
    </div>

        <div itemscope itemtype="http://schema.org/BlogPosting">
            <h1 itemprop="headline">Top 10 booze-infused getaways</h1>
            <link itemprop="author" href="http://www.cheapflights.com/news/author/stephanieschaefer/" />
            <p itemprop="description">Description of Blog</p>
        </div>

        <div itemscope itemtype="http://schema.org/BlogPosting">
            <h1 itemprop="headline">Top 10 booze-infused getaways</h1>
            <link itemprop="author" href="http://www.cheapflights.com/news/author/stephanieschaefer/" />
            <p itemprop="description">Description of Blog</p>
        </div>
</section>

それらをitemrefでリンクしようとしましたが、まだ機能していないようです。

    <section class="primary content-area" itemscope itemtype="http://schema.org/CollectionPage" itemref="blogs1 blogs2">
    <meta itemprop="name headline" content="Stepanie Schaefer" />
    <div itemid="http://www.cheapflights.com/news/author/stephanieschaefer/" itemscope itemtype="http://schema.org/Person">
       <h1 itemprop="headline"><span itemprop="name">Stephanie Schaefer</span></h1>
       <p itemprop="description">Stephanie is a Boston native who loves to find ways to escape New England winters. She’s thrown a coin in the Trevi Fountain, sipped wine on a vineyard in Northern Spain and swam in the Mediterranean Sea. Although she hasn’t been everywhere, it’s definitely on her list.</p>
    </div>
        <div itemscope itemtype="http://schema.org/BlogPosting" id="blogs1">
            <h1 itemprop="headline">Top 10 booze-infused getaways</h1>
            <link itemprop="author" href="http://www.cheapflights.com/news/author/stephanieschaefer/" />
            <p itemprop="description">Description of Blog</p>
        </div>

        <div itemscope itemtype="http://schema.org/BlogPosting" id="blogs2">
            <h1 itemprop="headline">Top 10 booze-infused getaways</h1>
            <link itemprop="author" href="http://www.cheapflights.com/news/author/stephanieschaefer/" />
            <p itemprop="description">Description of Blog</p>
        </div>
</section>

2つのオブジェクト"CollectionPage"と"BlogPosting"をリンクするにはどうすればよいですか？

htmlhtml5schema.orgmicrodata
1
Yen Deng

アイテムを関連付ける場合は、プロパティ（itemprop）を使用する必要があります。

itemref属性は、要素をネストできない場合に使用できますが、プロパティを使用する必要があります。あなたの例では、要素をネストできるようですので、itemrefを使用する必要はありません。

前の質問に対する私の答え で説明されているように、 mainEntity をItemListの値（および各ItemListのitemListElement、BlogPosting）で使用できます。

別のオプションは hasPart を使用することです。 mainEntity/ItemListの方法よりも表現力が低く、（blogPostで）Blogを使用する方が望ましい場合がありますが、非常に簡単なので、Microdataでの動作方法を説明できます。

ネスト（itemrefなし）

<section itemscope itemtype="http://schema.org/CollectionPage">

  <article itemprop="hasPart" itemscope itemtype="http://schema.org/BlogPosting">
  </article>

  <article itemprop="hasPart" itemscope itemtype="http://schema.org/BlogPosting">
  </article>

</section>

itemref（ネストなし）

<section itemscope itemtype="http://schema.org/CollectionPage" itemref="blogs1 blogs2">
</section>

<!-- don’t nest this 'article' inside another element with 'itemscope' -->
<article itemprop="hasPart" itemscope itemtype="http://schema.org/BlogPosting" id="blogs1">
</article>

<!-- don’t nest this 'article' inside another element with 'itemscope' -->
<article itemprop="hasPart" itemscope itemtype="http://schema.org/BlogPosting" id="blogs2">
</article>

（GoogleのSDTTは、この例ではid値を使用して@id値を出力しますが、 これはバグである可能性が高い です。各BlogPostingにitemid値を指定することで「上書き」できます。）

1
unor