summaryrefslogtreecommitdiff
path: root/devdocs/html/global_attributes%2Fitemtype.html
blob: 545af42d93a6bb087fab49229d6181fe88177d26 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<header><h1>itemtype</h1></header><div class="section-content">
<p>The <a href="../global_attributes">global attribute</a> <code>itemtype</code> specifies the URL of the vocabulary that will be used to define <code>itemprop</code>'s (item properties) in the data structure.</p> <p><a href="itemscope"><code>itemscope</code></a> is used to set the scope of where in the data structure the vocabulary set by <code>itemtype</code> will be active.</p> <p>Google and other major search engines support the <a href="https://schema.org/" target="_blank">schema.org</a> vocabulary for structured data. This vocabulary defines a standard set of type names and property names. For example, <code>MusicEvent</code> indicates a concert performance, with <a href="https://schema.org/startDate" target="_blank"><code>startDate</code></a> and <a href="https://schema.org/location" target="_blank"><code>location</code></a> properties specifying the concert's key details. In this case, <a href="https://schema.org/MusicEvent" target="_blank"><code>MusicEvent</code></a> would be the URL used by <code>itemtype</code>, with <code>startDate</code> and location as <code>itemprop</code>'s which <a href="https://schema.org/MusicEvent" target="_blank"><code>MusicEvent</code></a> defines.</p> <div class="notecard note" id="sect1"> <p><strong>Note:</strong> More about <code>itemtype</code> attributes can be found at <a href="https://schema.org/Thing" target="_blank">https://schema.org/Thing</a></p> </div> <ul> <li>The <strong>itemtype</strong> attribute must have a value that is an unordered set of unique tokens which are case-sensitive, each is a valid and absolute URL, and all 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/" target="_blank">schema.org</a>), and must all be defined to use the same vocabulary.</li> <li>The itemtype attribute can only be specified on elements which have an itemscope attribute specified.</li> <li>The itemid attribute can only be specified on elements which have both an itemscope attribute and an itemtype attribute specified. They must only be specified on elements with an itemscope attribute, whose itemtype attribute specifies a vocabulary not supporting 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 left to such specifications to define whether multiple items of the same global identifier (whether on the same page or different pages) are allowed to exist, and what processing rules for that vocabulary are, with respect to handling the case of multiple items with the same ID.</li> </ul>
</div>
<h2 id="examples">Examples</h2>

<h3 id="representing_structured_data_for_a_product">Representing structured data for a product</h3>
<div class="section-content">
<p>This example uses microdata attributes to represent structured data for a product, as follows:</p> <figure class="table-container"><div class="_table"><table class="standard-table"> <tbody> <tr> <td rowspan="7">itemscope</td> <td>itemtype</td> <td colspan="2">Product (http://schema.org/Product)</td> </tr> <tr> <td>itemprop</td> <td>name</td> <td>Executive Anvil</td> </tr> <tr> <td>itemprop</td> <td>image</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>description</td> <td> Sleeker than ACME's Classic Anvil, the Executive Anvil is perfect for the business traveler looking for something to drop from a height. </td> </tr> <tr> <td>itemprop</td> <td>mpn</td> <td>925872</td> </tr> <tr> <td>itemprop</td> <td>brand [Thing]</td> <td></td> </tr> <tr> <td>itemprop</td> <td>name</td> <td>ACME</td> </tr> <tr> <td rowspan="9">itemscope</td> <td>itemprop[itemtype]</td> <td>aggregateRating[AggregateRating]</td> <td></td> </tr> <tr> <td>itemprop</td> <td>ratingValue</td> <td>4.4</td> </tr> <tr> <td>itemprop</td> <td>reviewCount</td> <td>89</td> </tr> <tr> <td>itemprop</td> <td>offers [Offer]</td> <td>http://schema.org/Offer</td> </tr> <tr> <td>itemprop</td> <td>priceCurrency</td> <td>USD</td> </tr> <tr> <td>itemprop</td> <td>price</td> <td>119.99</td> </tr> <tr> <td>itemprop</td> <td>priceValidUntil</td> <td>2020-11-05</td> </tr> <tr> <td>itemprop</td> <td>itemCondition</td> <td>http://schema.org/UsedCondition</td> </tr> <tr> <td>itemprop</td> <td>availability</td> <td>http://schema.org/InStock</td> </tr> <tr> <td rowspan="2">itemscope</td> <td>itemprop[itemtype]</td> <td>seller [Organization]</td> <td>http://schema.org/Organization</td> </tr> <tr> <td>itemprop</td> <td>name</td> <td>Executive Objects</td> </tr> </tbody> </table></div></figure> <div class="notecard note" id="sect2"> <p><strong>Note:</strong> A handy tool for extracting microdata structures from HTML is Google's <a href="https://developers.google.com/search/docs/advanced/structured-data" target="_blank">Structured Data Testing Tool</a>. Try it on the HTML shown here.</p> </div> <h4 id="html">HTML</h4> <div class="code-example">
<p class="example-header"><span class="language-name">html</span></p>
<pre data-signature="xs0NtuqHCCP+Qfk487VHIXmN3tnXyemKldYW3YZ2MMA=" data-language="html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">itemscope</span> <span class="token attr-name">itemtype</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>http://schema.org/Product<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">itemprop</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>brand<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>ACME<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>br</span> <span class="token punctuation">/&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">itemprop</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>name<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span>Executive Anvil<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>br</span> <span class="token punctuation">/&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>img</span>
    <span class="token attr-name">itemprop</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>image<span class="token punctuation">"</span></span>
    <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://pixabay.com/static/uploads/photo/2015/09/05/18/15/suitcase-924605_960_720.png<span class="token punctuation">"</span></span>
    <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>50<span class="token punctuation">"</span></span>
    <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>50<span class="token punctuation">"</span></span>
    <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Executive Anvil logo<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>br</span> <span class="token punctuation">/&gt;</span></span>

  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>span</span> <span class="token attr-name">itemprop</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>description<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></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 class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>br</span> <span class="token punctuation">/&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>span</span><span class="token punctuation">&gt;</span></span>

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

<iframe class="sample-code-frame" title="Representing structured data for a product sample" id="frame_representing_structured_data_for_a_product" height="400" src="https://live.mdnplay.dev/en-US/docs/Web/HTML/Global_attributes/itemtype/runner.html?id=representing_structured_data_for_a_product" loading="lazy"></iframe>
</div>
</div>
<h2 id="specifications">Specifications</h2>
<div class="_table"><table class="standard-table">
<thead><tr><th scope="col">Specification</th></tr></thead>
<tbody><tr><td><a href="https://html.spec.whatwg.org/multipage/microdata.html#attr-itemtype">HTML Standard <br><small># attr-itemtype</small></a></td></tr></tbody>
</table></div>
<h2 id="browser_compatibility">Browser compatibility</h2>
<div class="_table"><table>
<thead>
<tr id="bct-browser-type">
<th></th>
<th colspan="6">Desktop</th>
<th colspan="6">Mobile</th>
</tr>
<tr id="bct-browsers">
<th></th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
<th>WebView Android</th>
<th>Chrome Android</th>
<th>Firefox for Android</th>
<th>Opera Android</th>
<th>Safari on IOS</th>
<th>Samsung Internet</th>
</tr>
</thead>
<tbody><tr>
<th><code>itemtype</code></th>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">12</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
<td class="bc-supports-yes">Yes</td>
</tr></tbody>
</table></div>
<h2 id="see_also">See also</h2>
<div class="section-content"><ul> <li><a href="../global_attributes">Other different global attributes</a></li> <li>Other microdata related global attributes: <ul> <li><a href="itemid"><code>itemid</code></a></li> <li><a href="itemprop"><code>itemprop</code></a></li> <li><a href="itemref"><code>itemref</code></a></li> <li><a href="itemscope"><code>itemscope</code></a></li> </ul> </li> </ul></div><div class="_attribution">
  <p class="_attribution-p">
    &copy; 2005&ndash;2023 MDN contributors.<br>Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.<br>
    <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype" class="_attribution-link">https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype</a>
  </p>
</div>