微数据而不是所有内容都在同一个地方

Microdata and not all content in same place

我想实施 Schema.org LocalBusiness

站点已经存在,不能更改布局。

LocalBusiness 所需的所有信息不在页面上的一个位置。

有人建议为模式隐藏一些元素 HTML 但据我所知这不是一个好主意。

另一个建议是将所有模式代码放在一个地方并将其隐藏,然后在页面上需要显示的地方再次呈现内容。 隐藏所有架构时的代码示例:

<div itemscope="" itemtype="http://schema.org/LocalBusiness">
  <span itemprop="name" style="display:none">Seattle, WA</span> 
   <img itemprop="image" src="/img/myimage.jpg" alt="Seattle, WA" style="display:none">
  <span itemprop="description" style="display:none">some description text</span>
  <div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress" style="display:none">
    <span itemprop="streetAddress">my street adderss</span> 
    <span itemprop="addressLocality">Blabla</span>, <span itemprop="addressRegion">WA</span>
  </div>
  <span itemprop="telephone" style="display:none"><a href="tel:123456789"> (123) 456-6789</a></span>
  <div itemprop="geo" itemscope="" itemtype="http://schema.org/GeoCoordinates" style="display:none">
    <meta itemprop="latitude" content="47.421356">
    <meta itemprop="longitude" content="-111.235178">
  </div>
</div>

我能想到的不隐藏内容和不更改页面布局的唯一方法是分解 LocalBusiness 代码,但不确定是否允许或可能这样做,如果允许的话如何?

可以用

包裹几乎整个页面吗
<div itemscope="" itemtype="http://schema.org/LocalBusiness">

并在整个页面需要的地方使用其余代码?

环绕

是的,你可以把整个内容包在这样一个div中。您也可以改用 bodyhtml 元素。

<body itemscope itemtype="http://schema.org/LocalBusiness">
  <!-- all "itemprop" in here will belong to this "LocalBusiness",
       unless they are nested under another "itemscope" -->
</body>

itemref

另一种选择是使用 itemref 属性。它允许您从页面上的任何位置向项目添加属性。

<div id="a">
  <span itemprop="name">Seattle, WA</span>
  <img itemprop="image" src="img.jpg" alt="">
</div>

<div itemscope itemtype="http://schema.org/LocalBusiness" itemref="a b c">
</div>

<span id="b" itemprop="telephone">(123) 456-6789</span>

<div>
  <p id="c" itemprop="description">some description text</p>
</div>

您必须确保这些引用的属性没有嵌套在另一个 itemscope 下,否则它们也会添加到此项中。

隐藏

如果您需要隐藏微数据的元素,请使用 link(对于 URI 值)和 meta(对于任何其他字符串值)元素。这两个元素在浏览器样式表中默认隐藏。

<div itemscope itemtype="http://schema.org/LocalBusiness">
  <meta itemprop="name" content="Seattle, WA">
  <link itemprop="image" href="img.jpg">
</div>