[html5] microdata itemref

[Ian Hickson]

On Mon, 10 Dec 2012, Brian Tremblay wrote:
>
> I'm trying to use itemref to include a location using microdata, and I'm 
> struggling. It's the wine tasting article at the bottom of the page at 
> http://www.tenmercer.com/
> 
> Here's a simplified version:
> 
> <article itemscope itemtype="http://schema.org/FoodEvent">
>   <header>
>     <h1 itemprop="name">Franciscan Estate tasting</h1>
> 
>     hosted by
>     <div itemprop="performer" itemscope itemtype="http://schema.org/Person">
>       <span itemprop="name">J. Kounellas</span>,
>       <span itemprop="worksFor" itemscope itemtype="http://schema.org/Winery">
>         <span itemprop="name">Franciscan Estate Winery</span>
>       </span>
>     </div>
>   </header>
> 
>   <p itemprop="description">Join us for a special wine event featuring
>   <a href="http://en.wikipedia.org/wiki/Napa_Valley_AVA">Napa Valley</a>'s
>   Franciscan Estate Winery.
>   </p>
> 
> </article>
> 
> 
> What I'm trying to do is associate "Napa Valley" in the <p> element with 
> the winery in the header, as that winery's addressRegion.

If you mean the URL:

  <article itemscope itemtype="http://schema.org/FoodEvent">
   <header>
     <h1 itemprop="name">Franciscan Estate tasting</h1>
 
     hosted by
     <div itemprop="performer" itemscope itemtype="http://schema.org/Person">
       <span itemprop="name">J. Kounellas</span>,
       <span itemprop="worksFor" itemscope itemtype="http://schema.org/Winery"
             itemref="wineryLocation">
         <span itemprop="name">Franciscan Estate Winery</span>
       </span>
     </div>
   </header>
 
   <p itemprop="description">Join us for a special wine event featuring
   <a id="wineryLocation" itemprop="addressRegion"
      href="http://en.wikipedia.org/wiki/Napa_Valley_AVA">Napa Valley</a>'s
   Franciscan Estate Winery.
   </p>
  </article>
 
If you mean the text, you need some additional markup because the <a> 
element in microdata only ever represents its URL, so e.g.:

  <article itemscope itemtype="http://schema.org/FoodEvent">
   <header>
     <h1 itemprop="name">Franciscan Estate tasting</h1>
 
     hosted by
     <div itemprop="performer" itemscope itemtype="http://schema.org/Person">
       <span itemprop="name">J. Kounellas</span>,
       <span itemprop="worksFor" itemscope itemtype="http://schema.org/Winery"
             itemref="wineryLocation">
         <span itemprop="name">Franciscan Estate Winery</span>
       </span>
     </div>
   </header>
 
   <p itemprop="description">Join us for a special wine event featuring
   <a href="http://en.wikipedia.org/wiki/Napa_Valley_AVA"
    ><span id="wineryLocation" itemprop="addressRegion">Napa 
    Valley</span></a>'s Franciscan Estate Winery.
   </p>
  </article>

Basically, though, you just put the itemref="" on the element with 
itemscope="" and give it IDs of elements to include as if they were 
children of the element with itemscope="".

HTH,
-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'