Microdata for product with variations

Question

I am new to microdata, and I have the following scenario for which I need help:

I want to put microdata on product pages where there can be several variations of the same product on the page. Each option has the same name, description and image, but each has its own SKU, color, size, weight and price.

On the page I have something like

<section id="commonparts"> <h1>Product name</h1> <div><img src="productimage"></div> <div>Product description</div> </section> <section id="variations"> <div id="variation1"> <div>SKU 1</div> <div>Colour 1</div> <div>Size 1</div> <div>Price 1</div> </div> <div id="variation2"> <div>SKU 2</div> <div>Colour 2</div> <div>Size 2</div> <div>Price 2</div> </div> </section> 

Is this possible for microdata?

Thank you in advance

Answer 1

You can use the Microdatas itemref attribute, so you do not need to duplicate identical data.

Use itemprop attributes for data that is identical for all products, give each property an id , but do not put these properties inside itemscope :

 <!-- no 'itemscope' parent --> <section> <h1 itemprop="name" id="product-name">Product name</h1> <img itemprop="image" id="product-img" src="productimage" alt="" /> <p itemprop="description" id="product-desc">Product description</p> </section> 

On each product (each represented by a Product element), you list all the id values ​​in your itemref attribute:

 <section> <div id="variation1" itemscope itemtype="http://schema.org/Product" itemref="product-name product-img product-desc"> <!-- properties specific to this 'Product' variation --> </div> <div id="variation2" itemscope itemtype="http://schema.org/Product" itemref="product-name product-img product-desc"> <!-- properties specific to this 'Product' variation --> </div> </section>