Mobile app version of vmapp.org
Login or Join
Gretchen104

: Schema.org: Having a Product as "about" property I want to define a Product as the main content of a webpage using Schema.org markup. My idea with the following HTML is to use the structure:

@Gretchen104

Posted in: #Html #Microdata #RichSnippets #Seo

I want to define a Product as the main content of a webpage using Schema.org markup. My idea with the following HTML is to use the structure:

- Webpage
-- WebPageElement (mainContentOfPage of Webpage)
--- Product (about of WebPageElement which is mainContentOfPage of Webpage)


However, using this markup, Google does not seem to recognize the Product properties such as the aggregateRating. The "structured markup tool" is only satisfied if I remove the "about" property on Product. But then the structure breaks into:

- Webpage
-- WebPageElement (mainContentOfPage of Webpage)
-- Product


Product is no longer a part of WebPageElement. Even if I use the property "mainContentOfPage" directly on the Product node, I get the same result: The Product is not recognized properly. It seems like the Product node cannot have any itemprops. So how should I proceed?

<body itemscope itemtype="http://schema.org/WebPage">
<div itemscope itemtype="http://schema.org/WebPageElement" itemprop="mainContentOfPage">
<div itemprop="about" itemscope itemtype="http://schema.org/Product">
<h1 itemprop="name">Acme Toaster Oven</h1>
<div itemprop="description">It toasts AND bakes.</div>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">Rated <span itemprop="ratingValue">3</span>/5 based on <span itemprop="reviewCount">2</span> reviews</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review"><span itemprop="name">A great toaster</span> - by <span itemprop="author">John</span>,
<meta itemprop="datePublished" content="2013-10-16">October 26, 2013
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"><span itemprop="ratingValue">5</span>/5</div>
<span itemprop="reviewBody">First I had bread. Then I had toast. Magic!</span>
</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review"><span itemprop="name">A small oven</span> - by <span itemprop="author">Mary</span>,
<meta itemprop="datePublished" content="2013-10-16">October 26, 2013
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"><span itemprop="ratingValue">1</span>/5</div>
<span itemprop="reviewBody">My 18-pound turkey wouldn't fit in this thing.</span>
</div>
</div>
</div>
</body>


The HTML can be tested here: www.google.com/webmasters/tools/richsnippets
Update

After experimenting with "itemref", I got pretty good results with this code in Google's tool and Yandex and the Structured Data Linter.

<body itemscope itemtype="http://schema.org/WebPage">
<div itemscope itemtype="http://schema.org/WebPageElement" itemprop="mainContentOfPage">
<meta itemprop="about" itemscope itemtype="http://schema.org/Product" itemref="theProduct" />
</div>
<div id="theProduct">
<h1 itemprop="name">Acme Toaster Oven</h1>
<div itemprop="description">It toasts AND bakes.</div>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">Rated <span itemprop="ratingValue">3</span>/5 based on <span itemprop="reviewCount">2</span> reviews</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review"><span itemprop="name">A great toaster</span> - by <span itemprop="author">John</span>,
<meta itemprop="datePublished" content="2013-10-16">October 26, 2013
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"><span itemprop="ratingValue">5</span>/5</div>
<span itemprop="reviewBody">First I had bread. Then I had toast. Magic!</span>
</div>
<div itemprop="review" itemscope itemtype="http://schema.org/Review"><span itemprop="name">A small oven</span> - by <span itemprop="author">Mary</span>,
<meta itemprop="datePublished" content="2013-10-16">October 26, 2013
<div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"><span itemprop="ratingValue">1</span>/5</div>
<span itemprop="reviewBody">My 18-pound turkey wouldn't fit in this thing.</span>
</div>
</div>
</div>
</body>


The only side effect is that the reviews and aggregateRating seem to connect to both the WebPage and the Product. I don't know if that's bad.

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Gretchen104

2 Comments

Sorted by latest first Latest Oldest Best

 

@Angie530

I agree with googlify's answer. Also, rather than having to use schema.org/Product. You might consider using schema.org/Offer instead and then with the itemprop=offers to help you nest it inside like you want it. Although, take my advice and stop using the schema.org/WebPageElement itemtype tag all together. It;s over redundant and nit that useful. you can get away with just using the itemprop="mainContentOfPage" by itself and it will work fine. Just be sure to add the sameAs, url and about properties if you are going to use mainEntity or mainEntityOfPage.

10% popularity Vote Up Vote Down


 

@Ann8826881

Last week’s Schema.org release (version 2.0) introduced two relevant properties:


mainEntity
mainEntityOfPage


This allows you to omit WebPageElement (which is not very useful in the first place) and use something like this:

<body itemscope itemtype="http://schema.org/WebPage">

<!-- properties about the web page -->

<div itemprop="mainEntity" itemscope itemtype="http://schema.org/Product">
<!-- properties about the product, which is the primary entity -->
</div>

</body>

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme