Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 1015463 of itemtype

  • Revision slug: Web/HTML/Global_attributes/itemtype
  • Revision title: itemtype
  • Revision id: 1015463
  • Created:
  • Creator: duncanmcdonald
  • Is current revision? No
  • Comment Changed Itemtype to unordered list
Tags: 

Revision Content

Summary

Itemtype specifies the URL of the vocabulary that will be used to define itemprop's (item properties) in the data structure. Itemscope is used to set the scope of  where in the data structure the vocabulary set by itemtype will be active.

Google and other major search engines support the schema.org vocabulary for structured data. This vocabulary defines a standard set of type names and property names, for example, MusicEvent indicates a concert performance, with startDate and and location properties to specify the concert's key details. In this case MusicEvent would be the URL used by itemtype and startDate and location would be itemprop's that MusicEvent defines.

Note: More about itemtype attributes can be found at https://schema.org/Thing

Simple example

HTML

<div itemscope itemtype="https://schema.org/Product">
  <span itemprop="brand">ACME</span>
  <span itemprop="name">Executive Anvil</span>
</div>

Structured data

itemscope itemtype schema.org Product
itemprop name Executive Anvil
itemprop brand [Thing]
itemprop name ACME

Itemtype

  • The itemtype attribute must have a value that is an unordered set of unique tokens that are case-sensitive, each of which is a valid URL that is an absolute URL, and all of which are defined to use the same vocabulary. The attribute's value must have at least one token.
  • The item types must all be types defined in applicable specifications (such as schema.org) and must all be defined to use the same vocabulary.
  • The itemtype attribute can only be specified on elements that have an itemscope attribute specified.
  • The itemid attribute can only be specified on elements that have both an itemscope attribute and an itemtype attribute specified, and can only be specified on elements with an itemscope attribute whose itemtype attribute specifies a vocabulary that does not support global identifiers for items, as defined by that vocabulary's specification.
  • The exact meaning of a global identifier is determined by the vocabulary's specification. It is up to such specifications to define whether multiple items with the same global identifier (whether on the same page or on different pages) are allowed to exist, and what the processing rules for that vocabulary are with respect to handling the case of multiple items with the same ID.

Example

HTML

<div itemscope itemtype="https://schema.org/Product">
  <span itemprop="brand">ACME<br></span>
  <span itemprop="name">Executive Anvil<br></span>
  <img itemprop="image" src="https://pixabay.com/static/uploads/photo/2015/09/05/18/15/suitcase-924605_960_720.png" width="50" height="50" alt="Executive Anvil logo" /><br>
  
<span itemprop="description">Sleeker than ACME's Classic Anvil, the
    Executive Anvil is perfect for the business traveler
    looking for something to drop from a height.
  <br>
</span>

  Product #: <span itemprop="mpn">925872<br></span>
  <span itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating">
    Rating: <span itemprop="ratingValue">4.4</span> stars, based on <span itemprop="reviewCount">89
      </span> reviews<p>
  </span>
  
<span itemprop="offers" itemscope itemtype="https://schema.org/Offer">
    Regular price: $179.99<br>
    <meta itemprop="priceCurrency" content="USD" />
    <span itemprop="price">Sale price: $119.99<br></span>
    (Sale ends <time itemprop="priceValidUntil" datetime="2020-11-05">
      5 November!</time>)<br>
    Available from: <span itemprop="seller" itemscope itemtype="https://schema.org/Organization">
                      <span itemprop="name">Executive Objects<br></span>
                    </span>
    Condition: <link itemprop="itemCondition" href="https://schema.org/UsedCondition"/>Previously owned,
      in excellent condition<br>
    <link itemprop="availability" href="https://schema.org/InStock"/>In stock! Order now!
</span>

  </span>

</div>

Result

HTML

{{ EmbedLiveSample('HTML_2', '300', '400', '', 'Web/HTML/Global_attributes/itemtype') }}

Structured data

itemscope itemtype Product (https://schema.org/Product)
itemprop name Executive Anvil
itemprop image https://pixabay.com/static/uploads/photo/2015/09/05/18/15/suitcase-924605_960_720.png
itemprop description
Sleeker than ACME's Classic Anvil, the Executive Anvil is perfect for the business traveler looking for something to drop from a height.
itemprop mpn 925872
itemprop brand [Thing]  
itemprop name ACME
itemscope itemprop[itemtype] aggregateRating[AggregateRating]  
itemprop ratingValue 4.4
itemprop reviewCount 89
itemprop offers [Offer] https://schema.org/Offer
itemprop priceCurrency USD
itemprop price 119.99
itemprop priceValidUntil 2020-11-05
itemprop itemCondition https://schema.org/UsedCondition
itemprop availability
https://schema.org/InStock
itemscope itemprop[itemtype] seller [Organization] https://schema.org/Organization
itemprop name Executive Objects

Note: A handy tool for extracting microdata structures from HTML is Google's Structured Data Testing Tool. Try it on the HTML shown above

SpecificationEditEdit

Specification Status
itemtype WG Note - No longer being actively developed

Document Tags and Contributors

Tags: 
 Contributors to this page: duncanmcdonald, jkronika, ClompenSander, teoli, dkocho4, sotos, Naveen_Tamanam
 Last updated by: duncanmcdonald,

The following reviews have been requested:

 

Revision Source

 
<h2 id="Summary">Summary</h2>

<p><strong>Itemtype </strong>specifies the URL of the vocabulary that will be used to define itemprop's (item properties) in the data structure. <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope">Itemscope</a> is used to set the scope of&nbsp; where in the data structure the vocabulary set by itemtype will be active.</p>

<p>Google and other major search engines support the <a href="https://schema.org/">schema.org</a> vocabulary for structured data. This vocabulary defines a standard set of type names and property names, for example, <a href="https://schema.org/MusicEvent">MusicEvent</a> indicates a concert performance, with <a href="https://schema.org/startDate">startDate</a> and and <a href="https://schema.org/location">location</a> properties to specify the concert's key details. In this case <a href="https://schema.org/MusicEvent">MusicEvent </a>would be the URL used by itemtype and startDate and location would be itemprop's that <a href="https://schema.org/MusicEvent">MusicEvent</a> defines.</p>

<div class="note">
<p><strong>Note:</strong> More about itemtype attributes can be found at <a href="https://schema.org/Thing">https://schema.org/Thing</a></p>
</div>

<h3 id="Simple_example">Simple example</h3>

<h4 id="HTML">HTML</h4>

<pre class="brush: html">
&lt;div itemscope itemtype="https://schema.org/Product"&gt;
  &lt;span itemprop="brand"&gt;ACME&lt;/span&gt;
  &lt;span itemprop="name"&gt;Executive Anvil&lt;/span&gt;
&lt;/div&gt;</pre>

<h4 id="Structured_data">Structured data</h4>

<table class="standard-table">
	<tbody>
		<tr>
			<td rowspan="4">itemscope</td>
			<td>itemtype</td>
			<td colspan="2" rowspan="1">schema.org <span>Product</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>name </span></td>
			<td><span>Executive Anvil</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td colspan="2" rowspan="1"><span>brand</span> [<span>Thing</span>]</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>name</span></td>
			<td><span>ACME</span></td>
		</tr>
	</tbody>
</table>

<h2 id="Itemtype">Itemtype</h2>

<ul>
	<li>The <strong>itemtype </strong>attribute must have a value that is an unordered set of unique tokens that are case-sensitive, each of which is a valid URL that is an absolute URL, and all of which are defined to use the same vocabulary. The attribute's value must have at least one token.</li>
	<li>The item types must all be types defined in applicable specifications (such as <a href="https://schema.org/">schema.org) </a>and must all be defined to use the same vocabulary.</li>
	<li>The itemtype attribute can only be specified on elements that have an itemscope attribute specified.</li>
	<li>The itemid attribute can only be specified on elements that have both an itemscope attribute and an itemtype attribute specified, and can only be specified on elements with an itemscope attribute whose itemtype attribute specifies a vocabulary that does not support global identifiers for items, as defined by that vocabulary's specification.</li>
	<li>The exact meaning of a global identifier is determined by the vocabulary's specification. It is up to such specifications to define whether multiple items with the same global identifier (whether on the same page or on different pages) are allowed to exist, and what the processing rules for that vocabulary are with respect to handling the case of multiple items with the same ID.</li>
</ul>

<h2 id="Example">Example</h2>

<h3 id="HTML_2">HTML</h3>

<pre class="brush: html">
&lt;div itemscope itemtype="https://schema.org/Product"&gt;
  &lt;span itemprop="brand"&gt;ACME&lt;br&gt;&lt;/span&gt;
  &lt;span itemprop="name"&gt;Executive Anvil&lt;br&gt;&lt;/span&gt;
  &lt;img itemprop="image" src="https://pixabay.com/static/uploads/photo/2015/09/05/18/15/suitcase-924605_960_720.png" width="50" height="50" alt="Executive Anvil logo" /&gt;&lt;br&gt;
  
&lt;span itemprop="description"&gt;Sleeker than ACME's Classic Anvil, the
    Executive Anvil is perfect for the business traveler
    looking for something to drop from a height.
  &lt;br&gt;
&lt;/span&gt;

  Product #: &lt;span itemprop="mpn"&gt;925872&lt;br&gt;&lt;/span&gt;
  &lt;span itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating"&gt;
    Rating: &lt;span itemprop="ratingValue"&gt;4.4&lt;/span&gt; stars, based on &lt;span itemprop="reviewCount"&gt;89
      &lt;/span&gt; reviews&lt;p&gt;
  &lt;/span&gt;
  
&lt;span itemprop="offers" itemscope itemtype="https://schema.org/Offer"&gt;
    Regular price: $179.99&lt;br&gt;
    &lt;meta itemprop="priceCurrency" content="USD" /&gt;
    &lt;span itemprop="price"&gt;Sale price: $119.99&lt;br&gt;&lt;/span&gt;
    (Sale ends &lt;time itemprop="priceValidUntil" datetime="2020-11-05"&gt;
      5 November!&lt;/time&gt;)&lt;br&gt;
    Available from: &lt;span itemprop="seller" itemscope itemtype="https://schema.org/Organization"&gt;
                      &lt;span itemprop="name"&gt;Executive Objects&lt;br&gt;&lt;/span&gt;
                    &lt;/span&gt;
    Condition: &lt;link itemprop="itemCondition" href="https://schema.org/UsedCondition"/&gt;Previously owned,
      in excellent condition&lt;br&gt;
    &lt;link itemprop="availability" href="https://schema.org/InStock"/&gt;In stock! Order now!
&lt;/span&gt;

  &lt;/span&gt;

&lt;/div&gt;</pre>

<h3 id="Result">Result</h3>

<h4 id="HTML_3">HTML</h4>

<p>{{ EmbedLiveSample('HTML_2', '300', '400', '', 'Web/HTML/Global_attributes/itemtype') }}</p>

<h4 id="Structured_data_2">Structured data</h4>

<table class="standard-table" style="height:655px; width:1342px">
	<tbody>
		<tr>
			<td colspan="1" rowspan="7">itemscope</td>
			<td>itemtype</td>
			<td colspan="2" rowspan="1"><span>Product</span> (https://schema.org/Product)</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>name</span></td>
			<td><span>Executive Anvil</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>image</span></td>
			<td>https://pixabay.com/static/uploads/photo/2015/09/05/18/15/suitcase-924605_960_720.png</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>description</span></td>
			<td>
			<div><span>Sleeker than ACME's Classic Anvil, the Executive Anvil is perfect for the business traveler looking for something to drop from a height.</span></div>
			</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>mpn</span></td>
			<td><span>925872</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>brand</span> [<span>Thing</span>]</td>
			<td>&nbsp;</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>name</span></td>
			<td><span>ACME</span></td>
		</tr>
		<tr>
			<td colspan="1" rowspan="9">itemscope</td>
			<td>itemprop[itemtype]</td>
			<td><span>aggregateRating</span>[<span>AggregateRating</span>]</td>
			<td>&nbsp;</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>ratingValue</span></td>
			<td><span>4.4</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>reviewCount</span></td>
			<td><span>89</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>offers</span> [<span>Offer</span>]</td>
			<td>https://schema.org/Offer</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>priceCurrency</span></td>
			<td><span>USD</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>price</span></td>
			<td><span>119.99</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>priceValidUntil</span></td>
			<td><span>2020-11-05</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>itemCondition</span></td>
			<td><span>https://schema.org/UsedCondition</span></td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>availability</span></td>
			<td>
			<div><span>https://schema.org/InStock</span></div>
			</td>
		</tr>
		<tr>
			<td colspan="1" rowspan="2">itemscope</td>
			<td>itemprop[itemtype]</td>
			<td><span>seller</span> [<span>Organization</span>]</td>
			<td>https://schema.org/Organization</td>
		</tr>
		<tr>
			<td>itemprop</td>
			<td><span>name</span></td>
			<td><span>Executive Objects</span></td>
		</tr>
	</tbody>
</table>

<div class="note">
<p><strong>Note</strong>: A handy tool for extracting microdata structures from HTML is Google's <a href="https://developers.google.com/structured-data/testing-tool/">Structured Data Testing Tool</a>. Try it on the HTML shown above</p>
</div>

<div class="column-half wiki-column text-content" id="wiki-content">
<article id="wikiArticle">
<article id="wikiArticle">
<h2 id="SpecificationEditEdit">Specification<a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-alternates$edit#Specifications"><span>Edit</span></a><a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid$edit#SpecificationsEdit"><span>Edit</span></a></h2>

<table class="standard-table" style="height:105px; width:490px">
	<thead>
		<tr>
			<th scope="col">Specification</th>
			<th scope="col">Status</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td style="text-align: left; vertical-align: middle;"><a class="external-icon external" href="https://html.spec.whatwg.org/multipage/microdata.html#items">itemtype</a></td>
			<td style="text-align: left; vertical-align: middle; white-space: nowrap;">WG Note - No longer being actively developed</td>
		</tr>
	</tbody>
</table>
</article>
</article>

<div class="share"><strong>Share:</strong>

<ul>
	<li><a class="share-link twitter" data-title="I learned about itemscope on MDN." data-url="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope?utm_campaign=share&amp;utm_medium=doc+share+link&amp;utm_source=twitter.com" href="https://twitter.com/share?url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FGlobal_attributes%2Fitemscope%3Futm_campaign%3Dshare%26utm_medium%3Ddoc%2Bshare%2Blink%26utm_source%3Dtwitter.com&amp;text=I+learned+about+itemscope+on+MDN." target="_blank">Twitter</a></li>
	<li><a class="share-link facebook" data-title="I learned about itemscope on MDN." data-url="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope?utm_campaign=share&amp;utm_medium=doc+share+link&amp;utm_source=facebook.com" href="https://facebook.com/sharer.php?s=100&amp;p[url]=https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope?utm_campaign=share&amp;utm_medium=doc+share+link&amp;utm_source=facebook.com" target="_blank">Facebook</a></li>
	<li><a class="share-link gplus" data-title="I learned about itemscope on MDN." data-url="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope?utm_campaign=share&amp;utm_medium=doc+share+link&amp;utm_source=plus.google.com" href="https://plus.google.com/share?url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FGlobal_attributes%2Fitemscope%3Futm_campaign%3Dshare%26utm_medium%3Ddoc%2Bshare%2Blink%26utm_source%3Dplus.google.com" target="_blank">Google+</a></li>
</ul>
</div>

<div class="wiki-block contributors">
<h2 class="offscreen" id="Document_Tags_and_Contributors">Document Tags and Contributors</h2>

<div class="tag-attach-list contributors-sub"><strong>Tags:</strong>&nbsp;

<ul class="tags tags-small">
	<li><a href="https://developer.mozilla.org/en-US/docs/tag/Example">Example</a></li>
	<li><a href="https://developer.mozilla.org/en-US/docs/tag/itemscope">itemscope</a></li>
	<li><a href="https://developer.mozilla.org/en-US/docs/tag/ItemType">ItemType</a></li>
	<li><a href="https://developer.mozilla.org/en-US/docs/tag/itemtype">itemtype</a></li>
</ul>
</div>

<div class="contributors-sub">&nbsp;<strong>Contributors to this page:</strong> <a href="https://developer.mozilla.org/en-US/profiles/duncanmcdonald">duncanmcdonald</a>, <a href="https://developer.mozilla.org/en-US/profiles/jkronika">jkronika</a>, <a href="https://developer.mozilla.org/en-US/profiles/ClompenSander">ClompenSander</a>, <a href="https://developer.mozilla.org/en-US/profiles/teoli">teoli</a>, <a href="https://developer.mozilla.org/en-US/profiles/dkocho4">dkocho4</a>, <a href="https://developer.mozilla.org/en-US/profiles/sotos">sotos</a>, <a href="https://developer.mozilla.org/en-US/profiles/Naveen_Tamanam">Naveen_Tamanam</a></div>

<div class="contributors-sub">&nbsp;<strong>Last updated by:</strong> <a href="https://developer.mozilla.org/en-US/profiles/duncanmcdonald">duncanmcdonald</a>, <time datetime="2016-02-12T00:55:07-08:00">Feb 12, 2016, 12:55:07 AM</time></div>
</div>
</div>

<div class="column-strip wiki-column" id="wiki-left">
<section class="page-meta reviews" id="sect1">
<p>The following reviews have been requested:</p>

<ul>
	<li><input id="id_approve_technical" name="approve_technical" type="checkbox" value="approve_technical" /> <label for="id_approve_technical">Technical</label></li>
	<li><input id="id_approve_editorial" name="approve_editorial" type="checkbox" value="approve_editorial" /> <label for="id_approve_editorial">Editorial</label></li>
</ul>
</section>
</div>

<div class="column-container column-container-reverse">
<div class="column-strip wiki-column" id="wiki-left">
<section class="page-meta reviews" id="sect2">&nbsp;</section>
</div>
</div>
Revert to this revision