Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Different div, same itemscope

I just started updating my website with Schema.org put one thing doesn't works out how expected it.

I want to apply the following properties to a newsarticle:

  • Name
  • Headline
  • Articlebody
  • Datepublished
  • Author
    • Name
    • Url

The problem is, these properties are not all in the same div. So basicly you'll see it like:

enter image description here

What happens is, is when I test it with Google Rich Snippets tester the second div is placed as a property of 'webpage' instead of a property of 'newsarticle'.

How should this be fixed? Or do I have to change my whole layout?

Edit: Before you suggest, at the moment it's not possible to put div 1 and div 2 into 1 wrapper because of the rest of the layout.

like image 551
Sebass van Boxel Avatar asked Dec 06 '25 12:12

Sebass van Boxel


1 Answers

Use the itemref attribute on the same element as the itemscope attribute. Like this:

<!DOCTYPE html>
<title>Test</title>
<div id="div1" itemref="dpub auth" itemscope itemtype="http://schema.org/NewsArticle" >
  <div itemprop="name">Article Name</div>
</div>
<div id="div2">
  <div id="dpub" itemprop="datepublished">September 1 2012</div>
  <div id="auth" itemscope itemprop="Author" >
    <div itemprop="name">John Smith</div>
    <div itemprop="url">http:/www.example.net</div>
  </div>
</div>

Check it out in the snippets testing tool

like image 135
Alohci Avatar answered Dec 08 '25 03:12

Alohci



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!