I have a website which list multiple companies, my markup goes something like this:
<h2>Checkout those cool companies</h2>
<div itemscope="itemscope" itemtype="https://schema.org/Organization">
<img itemprop="logo" src="logo1.jpg" alt="">
<h3 itemprop="name">Company1</h3>
<p itemprop="description">It's a great company</p>
<span itemprop="url">http://company1.com</span>
</div>
<div itemscope="itemscope" itemtype="https://schema.org/Organization">
<img itemprop="logo" src="logo2.jpg" alt="">
<h3 itemprop="name">Company2</h3>
<p itemprop="description">It's a great company as well</p>
<span itemprop="url">http://company2.com</span>
</div>
<div itemscope="itemscope" itemtype="https://schema.org/Organization">
<img itemprop="logo" src="logo3.jpg" alt="">
<h3 itemprop="name">Company3</h3>
<p itemprop="description">It's a amazing company</p>
<span itemprop="url">http://company3.com</span>
</div>
I'm using itemtype="https://schema.org/Organization multiples times in order to help crawler better identify the content.
Is this an appropriate use of https://schema.org/Organization?
How can I make my own https://schema.org/Organization not conflict with the companies markup I'm listing?
Yes, it’s correct to use multiple Organization items for this purpose.
To make clear that your own Organization is not part of this list, you could
provide it as value for author/publisher (of the WebPage), and
provide an ItemList for the list of the other organizations.
In case this list of organizations is the main content for that page, you could use mainEntity (for the ItemList) and use CollectionPage instead of WebPage:
<body itemscope itemtype="http://schema.org/CollectionPage">
<div itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
</div>
<section itemprop="mainEntity" itemscope itemtype="http://schema.org/ItemList">
<h2>Checkout those <span itemprop="name">cool companies</span></h2>
<article itemprop="itemListElement" itemscope itemtype="http://schema.org/Organization"></article>
<article itemprop="itemListElement" itemscope itemtype="http://schema.org/Organization"></article>
<article itemprop="itemListElement" itemscope itemtype="http://schema.org/Organization"></article>
</section>
</body>
Related
I was wondering what is the best way to structure (Microdata) a list of manufactures that a company represents.
I have the following example as a List. Would this work?
<div itemscope itemtype="http://schema.org/ItemList">
<div>
<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<div>
<img itemprop=image data-src="/companyALogo.jpg" alt="Company A" />
<div>
<meta itemprop="position" content=0>
<div itemprop="name">Company A</div>
<div>
<a itemprop="url" href="https://company/companyAPage"> More On Company A</a>
</div>
</div>
</div>
</div>
<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<div>
<img itemprop=image data-src="/companyALogo.jpg" alt="Company B" />
<div>
<meta itemprop="position" content=1>
<div itemprop="name">Company B</div>
<div>
<a itemprop="url" href="https://company/companyBPage"> More On Company B</a>
</div>
</div>
</div>
</div>
<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<div>
<img itemprop=image data-src="/companyCLogo.jpg" alt="Company C" />
<div>
<meta itemprop="position" content=2>
<div itemprop="name">Company C</div>
<div>
<a itemprop="url" href="https://company/companyCPage"> More On Company C</a>
</div>
</div>
</div>
</div>
</div>
</div>
Your structured data just conveys that there is a list of something, where each list item has a name and a URL. It does not convey the context for the list, and it does not convey what each list item is supposed to represent.
A manufacturer would usually be an Organization, or more specifically a LocalBusiness.
The itemListElement property allows you to provide LocalBusiness items directly, or you could use intermediate ListItem items, to which you can add the LocalBusiness items via the item property.
<div itemprop="itemListElement" itemscope itemtype="http://schema.org/LocalBusiness">
</div>
<div itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<div itemprop="item" itemscope itemtype="http://schema.org/LocalBusiness">
</div>
</div>
Unless a consumer (like Google Search) requires the slightly more complex ListItem way for a specific feature, the only reason for using it would be if the item order is relevant. The reason is that Microdata doesn’t capture the order of the HTML elements, so you need to use the position property if the order matters.
So now it’s clear that it’s a list of businesses, but it’s still not clear what the purpose of the list is. I’m not sure what "a list of manufactures that a company represents" means exactly, but if Schema.org offers a suitable property to convey this, it’s likely that it doesn’t work with an ItemList, but by providing multiple values for the property directly. So you might have to weigh up the disadvantages and advantages.
I have a project - http://preloaders.net. I have set it up so that rating is shown in google search (the orange stars under the title, e.g. try entering preloader spinner keywords ). Everything is working fine, except for home page as I just fixed it.
I am re-coding the whole markup now to HTML5 (which I am pretty new to) and use schema.org and include all products to the whole schema, but I do not know what the substitute for Review-aggregate in schema.org is, so I am trying WebPage. Google webmaster does not show errors, but the question is: will the following code still show the stars or should I do something else?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>my title</title>
</head>
<body>
<nav>
</nav>
<main>
<section>
<h1>AJAX LOADERS</h1>
<article itemscope itemtype="http://schema.org/Product">
<figure>
<img itemprop="image" src="/preloader.gif" alt="">
<figcaption itemprop="description">
Spinning Christmas tree with balls.
</figcaption>
</figure>
<a href="#" title="#" itemprop="url">
<h3 itemprop="name">3D Christmas tree </h3>
</a>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="priceCurrency" content="USD">$</span><span class="price" itemprop="price">2.95</span>
</div>
<div class="favorite"></div>
<div class="add-to-cart"></div>
<div class="frames-amount">30 fr</div>
<div class="dimensions">256x256</div>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
Average Rating: <span itemprop="ratingValue">5</span>
Votes: <span itemprop="ratingCount">12</span>
</div>
</article>
</section>
<aside>
<article itemscope itemtype="http://schema.org/Product">
<a href="/en/free">
<h3 itemprop="name">Free templates</h3>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="priceCurrency" content="USD">$</span><span class="price" itemprop="price">0</span>
</div>
<div itemprop="description">
Spinning Christmas tree with balls.
</div>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
Average Rating: <span itemprop="ratingValue">5</span>
Votes: <span itemprop="ratingCount">12</span>
</div>
</a>
</article>
</aside>
</main>
<footer>
<nav>
</nav>
</footer>
<script type="application/ld+json">
{ "#context": "http://schema.org",
"#type": "WebPage",
"name": "Loading GIF & APNG (AJAX loaders) generator",
"description": "More than 800 free and premium ajax loader (loading animated GIF and APNG) spinners, bars and 3D animations generator for AJAX and JQuery",
"aggregateRating":
{"#type": "AggregateRating",
"ratingValue": "4.9",
"reviewCount": "7",
"itemReviewed": "AJAX loaders generator"
}
}
</script>
</body>
</html>
Sorry for noob question, just need to make sure I am in the right direction.
Thanks in advance.
Here is an example of what you have to do
And here is the official documentation
What you've done is versy similar to the code from the exampple so I guess that what you've done is enough to have the stars
I'm trying to create Google Rich Snippets for my Product page.
I've created a Product using
<div itemscope="" itemtype="http://schema.org/Product">
...
</div>
Inside this product, I have an Offer, created with
<div itemscope="" itemtype="http://schema.org/Product">
<div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
...
</div>
</div>
I want to add the seller property (an Organization) to the Offer, however, my HTML structure have the seller under the Product and not under the Offer.
<div itemscope="" itemtype="http://schema.org/Product">
<div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
...
</div>
<div itemprop="seller" itemscope="" itemtype="http://schema.org/Organization">
...
</div>
</div>
However, this doesn't seem to please the Google Structured Data testing tool.
I have then tried with using itemref on the Organization and using a meta-tag in the Offer
<div itemscope="" itemtype="http://schema.org/Product">
<div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
<meta itemprop="seller" itemref="provider">
...
</div>
<div id="provider" itemscope="" itemtype="http://schema.org/Organization">
...
</div>
</div>
But it still doesn't seem to recognize the seller as the Organization.
What am I doing wrong?
You are not using itemref correctly:
The itemref attribute has to be specified on an element with itemscope.
It has to reference an element with itemprop.
So your example would have to look like:
<div itemscope itemtype="http://schema.org/Product">
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" itemref="provider">
</div>
<div id="provider" itemprop="seller" itemscope itemtype="http://schema.org/Organization">
</div>
</div>
But this does not work, because this way, the seller property will be added to both items, Product and Offer. This is not valid because Product can’t have the seller property.
So you would either have to change the nesting, or don’t use Product on the container div.
However, there’s also an ugly fix: add a dummy element with itemscope:
<div itemscope itemtype="http://schema.org/Product">
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" itemref="provider">
</div>
<div itemscope>
<div id="provider" itemprop="seller" itemscope itemtype="http://schema.org/Organization">
</div>
</div>
</div>
Let's say I have the mark-up like this:
<ul id="comments">
<li class="comment">
<div class="author">on Friday 3th, Jenny said:</div>
<div class="content"><p>bla bla</p></div>
</li>
<li class="comment">
<div class="author">on Friday 3th, Jenny said:</div>
<div class="content"><p>bla bla</p></div>
<ul class="level-2">
<li class="comment">
<div class="author">on Friday 3th, Mary said:</div>
<div class="content">stfu jenny</div>
</li>
</ul>
</li>
...
How do I use the "UserComments" item on this mark-up ?
http://schema.org/UserComments
Where do I add itemscope itemtype="http://schema.org/UserComments" ? Once on the list container, or multiple times on each list item?
You shouldn't be using itemprop="name", but instead use "creator".
More examples... http://homebiss.blogspot.com/2011/11/schema-markups-blogger-comments.html
According to the HTML5 Microdata typed items specs, you would add it to the container of your comments section, e.g.
<section itemscope itemtype="http://example.org/animals#cat">
<h1 itemprop="name">Hedral</h1>
<p itemprop="desc">Hedral is a male american domestic
shorthair, with a fluffy black fur with white paws and belly.</p>
<img itemprop="img" src="hedral.jpeg" alt="" title="Hedral, age 18 months">
</section>
So the item scope for your comment section would be formatted like this (taking into account the item properties):
<ul id="comments" itemscope itemtype="http://schema.org/UserComments">
<li class="comment">
<div itemprop="name" class="author"><span itemprop="commentTime">on Friday 3th</span>, Jenny said:</div>
<div itemprop="commentText" class="content"><p>bla bla</p></div>
</li>
<li class="comment">
<div itemprop="name" class="author"><span itemprop="commentTime">on Friday 3th</span>, Jenny said:</div>
<div itemprop="commentText" class="content"><p>bla bla</p></div>
<ul class="level-2">
<li class="comment">
<div itemprop="name" class="author"><span itemprop="commentTime">on Friday 3th</span>, Mary said:</div>
<div itemprop="commentText" class="content">stfu jenny</div>
</li>
</ul>
</li>
...
Each comment would be an own item (UserComments in your example). You might also want to use an article element for each comment.
<article itemscope itemtype="http://schema.org/UserComments">
<header>
on
<time itemprop="commentTime" datetime="…">Friday 3th</time>,
<span itemprop="creator" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Jenny</span>
</span>
said:
</header>
<p itemprop="commentText">bla bla</p>
</article>
However, now there is also Comment, which seems to be more appropriate because it’s a CreativeWork (and not an Event, like UserComments).
Due to schema.org, It is good to change using userComments to Comment:
UserInteraction and its subtypes is an old way of talking about users interacting with pages. It is generally better to use Action-based vocabulary, alongside types such as Comment.
But you can use this item by adding commentText property and creator as a person to it.
I'm creating a simple (well, it was going to be simple before I decided to mark it up with Microdata) web page containing company contact information for a business with two offices. I'm using schema.org and LocalBusiness for the two offices.
Here are the relevant parts of my HTML:
<body itemscope itemtype="http://schema.org/Corporation">
<header>
<hgroup>
<h1>Company Name</h1>
<h2 itemprop="description">Company description</h2>
</hgroup>
</header>
<section>
<h1><span itemprop="name">Company Name Limited</span> Offices</h1>
<article itemscope itemtype="http://schema.org/LocalBusiness">
<h2 itemprop="name">Company Name, Location 1 Office</h2>
<p itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Street Address</span><br />
<span itemprop="addressLocality">Locality</span><br />
<span itemprop="addressRegion">Region</span><br />
<span itemprop="postalCode">Postcode</span><br />
<span itemprop="addressCountry">Country</span>
</p>
<p><a itemprop="maps" href="http://maps.google.co.uk/blahblah">Map</a></p>
<p>Telephone: <span itemprop="telephone">01234 567890</span><br />
Fax: <span itemprop="faxNumber">01234 567890</span><br />
Email: <span itemprop="email">email#domain.co.uk</span><br />
http://www.domain.co.uk</p>
<!-- itemprop="branchOf" -->
</article>
<article itemscope itemtype="http://schema.org/LocalBusiness">
<h2 itemprop="name">Company Name, Location 2 Office</h2>
<p itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Street Address</span><br />
<span itemprop="addressLocality">Locality</span><br />
<span itemprop="addressRegion">Region</span><br />
<span itemprop="postalCode">Postcode</span><br />
<span itemprop="addressCountry">Country</span>
</p>
<p><a itemprop="maps" href="http://maps.google.co.uk/blahblah">Map</a></p>
<p>Telephone: <span itemprop="telephone">01234 567890</span><br />
Fax: <span itemprop="faxNumber">01234 567890</span><br />
Email: <span itemprop="email">email#domain.co.uk</span><br />
http://www.domain.co.uk</p>
<!-- itemprop="branchOf" -->
</article>
</section>
</body>
Where I currently have <!-- itemprop="branchOf" -->, I believe I need to associate the LocalBusinesses with the Corporation mentioned earlier in the page.
How should I do this? Can an element id be used for this?
Thanks.
This is possible with the use of the itemref attribute:
Add itemprop="branchOf" to the body
Add an id to the body, e.g. id="foo"
Add itemref="foo" to both article
Reduced example:
<body id="foo" itemprop="branchOf" itemscope itemtype="http://schema.org/Corporation">
<span itemprop="name">Company Name Limited</span>
<article itemscope itemtype="http://schema.org/LocalBusiness" itemref="foo">
<span itemprop="name">Company Name, Location 1 Office</span>
</article>
<article itemscope itemtype="http://schema.org/LocalBusiness" itemref="foo">
<span itemprop="name">Company Name, Location 2 Office</span>
</article>
</body>
You can use #itemref for this, have a look at this example - I normally use Philip's Live Microdata service to test it.
Since "branchOf" refers to an Organization and an Organization has a url (like everything), I guess "branchOf" should point to the url of the Organization.
I think you should try this:
<p id="office-place" itemprop="branchOf" itemscope itemtype="http://www.schema.org/Organization"><span itemprop="name">Company Name</span></p>