Rich Snippets: Microdata itemprop из Itemtype?

Question

Недавно я решил обновить веб-сайт, добавив богатые фрагменты - микроданные. Дело в том, что я новичок в таких вещах, и у меня есть небольшой вопрос об этом.

Я пытаюсь определить организацию, как вы можете видеть из приведенной ниже коды:

<div class="block-content" itemscope itemtype="http://schema.org/Organization"> 
<p itemprop="name">SOME ORGANIZATION</p> 
<p itemprop="address" itemscope itemtype="http://schema.org/PostalAddress"> 
<span itemprop="streetAddress">Manufacture Street no 4</span>, 
<span itemprop="PostalCode">4556210</span><br /> 
<span itemprop="addressLocality">CityVille</span>, 
<span itemprop="addressCountry">SnippetsLand</span></p> 
<hr> 
<p itemprop="telephone">0444 330 226</p> 
<hr> 
<p><a href="mailto:info@snippets.com" itemprop="email">info@snippets.com</a></p> 
</div> 

Теперь мои проблемы заключается в следующем: я хотел бы также пометить логотип, чтобы сделать полный профиль организации, но логотип находится в заголовке моей страницы, а div, который я разместил выше, находится в нижнем колонтитуле, а стиль/макет страницы не позволяет мне добавить логотип здесь, а также сделать его видимым ,

Итак, как я могу решить эту проблему? Какое лучшее решение?

Спасибо.

Answer 1

Дэн, вы можете просто добавить в схеме логотипа с этим кодом:

<img itemprop="logo" src="http://www.example.com/logo.png" /> 

Таким образом, в вашем примере, вы могли бы просто пометить его как:

<div class="block-content" itemscope itemtype="http://schema.org/Organization"> 
<p itemprop="name">SOME ORGANIZATION</p> 
<img itemprop="logo" src="http://www.example.com/logo.png" /> 
<p itemprop="address" itemscope itemtype="http://schema.org/PostalAddress"> 
<span itemprop="streetAddress">Manufacture Street no 4</span>, 
<span itemprop="PostalCode">4556210</span><br /> 
<span itemprop="addressLocality">CityVille</span>, 
<span itemprop="addressCountry">SnippetsLand</span></p> 
<hr> 
<p itemprop="telephone">0444 330 226</p> 
<hr> 
<p><a href="mailto:info@snippets.com" itemprop="email">info@snippets.com</a></p> 
</div> 

Я считаю, что должно работать ваш конкретный случай, и на самом деле он не покажет логотип, и вам не придется отдельно размещать логотип. Надеюсь, это поможет.

Answer 2

Вы можете использовать itemref attribute.

Дайте свой логотип в заголовке id и добавьте соответствующий itemprop:

<img src="acme-logo.png" alt="ACME Inc." itemprop="logo" id="logo" /> 

Теперь добавьте itemref="logo" к вашему div в сноске:

<div class="block-content" itemscope itemtype="http://schema.org/Organization" itemref="logo"> 
    … 
</div> 

---

Если это не представляется возможным в вашем случае вы можете «дублировать» логотип так, чтобы он был включен в ваш div, но не был виден. Микроданные допускают meta и link элементов в body для этого случая. Вы должны использовать элемент link, так как http://schema.org/Organization ожидает URL-адрес для logo property. (В качестве альтернативы добавьте его через meta в качестве отдельного ImageObject).

<div class="block-content" itemscope itemtype="http://schema.org/Organization"> 
    … 
    <link itemprop="logo" src="logo.png" /> 
    … 
</div> 

---

Side Примечание: Я не думаю, что вы используете hr element правильно в вашем примере. Если вы просто хотите отобразить горизонтальную линию, вы должны использовать CSS (например, border-top на p).