We use cookies on this site to remember: your settings, your history, whether you are logged in and to give you a better experience.
More info about cookies
Accept Cookies
Opt Out
You have an excellent choice of browser. Why not add our quick launch app so you can easily manage your shop in the future.Get our free app from the Google Chrome Store.
Login       Register
- David
About the Author:
David tastes like lemons when he is scared and has claws for feet, he is often found hanging from trees and uses shoe laces to catch butterflies.
About the Article:
Category: Search Engine Optimisation
Permalink
About the Blog:
GroovyCart is an online shop provider. We put this blog together to give us a place to ramble and put up any solutions to technical problems that may help other web developers. We will also put some guides up to help our shops with practical information on selling online.
To open your own online shop click here.

How to get a star rating / review / product price / stock in-line on your Google Searches.

“
Once again I should say we have already done this for all of the shops running on GroovyCart so you don't need to do anything. We have only put this up for other web developers that need help doing it.

Example 1 - Product with a single price

Here is the most simple example of how to get a product price on your Google Search Listing, with image, price, name, stock, currency and description: 



<div itemscope itemtype="http://data-vocabulary.org/Product" >
    <h1 class="prodname" itemprop="name">Handmade Bracelet</h1>
    <img src="productimages/c000255/p048537_m_250pxBracelet.jpg" alt="Handmade Bracelet" name="main" class="ProductImage" id="main" itemprop="image"/>
    <span itemprop="offerDetails" itemscope itemtype="http://data-vocabulary.org/Offer"><h3>PRICE: Was: <del>£7.20</del> Now: £<span itemprop="price">5.40</span></h3></span><br />
    <span itemprop="stock">4</span> <span itemprop="availability" content="in_stock">in stock</span>.
    Quantity: <input name="quantity" type="text" id="quantity" value="1" size="4" maxlength="4" />
    <meta itemprop="currency" content="GBP" />
    <strong>Description:</strong><br />
    <div class="proddesc" itemprop="description">Description would go here but it's so long we have removed it. </div>
</div>

Using :
itemscope http://data-vocabulary.org/Product
itemscope http://data-vocabulary.org/Offer

With:

  • itemprop name
  • itemprop image
  • itemprop price
  • itemprop stock
  • itemprop availability
  • itemprop currency
  • itemprop condition
  • itemprop description

Example 2 - Product with a single price

Here is the an example of how to get a product price on your Google Search Listing: 



<div itemscope itemtype="http://data-vocabulary.org/Product" >
	<h1 class="prodname" itemprop="name">Handmade Bracelet</h1>
	<h2>Sale 25% off!</h2>		
	<img src="productimages/c000255/p048537_m_250pxBracelet.jpg" alt="Handmade Bracelet" name="main" class="ProductImage" id="main" itemprop="image"/>
	<form id="form1" name="form1" method="GET" action="Input/AddToBasket.php?product=48537">
        <span itemprop="offerDetails" itemscope itemtype="http://data-vocabulary.org/Offer"><h3>PRICE: Was: <del>£7.20</del> Now: £<span itemprop="price">5.40</span></h3></span><br />
        <span itemprop="stock">4</span> <span itemprop="availability" content="in_stock">in stock</span>.
        Quantity: <input name="quantity" type="text" id="quantity" value="1" size="4" maxlength="4" />
    </form>
	<p><a href="cart.php?c=255&cat=bracelets">View other products in the <span itemprop="category">bracelets</span> category. </a></p>
    <span style="display:none;" itemprop="seller">Lucy's Handmade Jewellery</span>
	<span style="display:none;" itemprop="brand">Handmade</span>
	<span style="display:none;" itemprop="category">Apparel & Accessories > Jewelry > Bracelets</span>
	<span style="display:none;" itemprop="identifier"></span>
	<meta itemprop="currency" content="GBP" />
	<span style="display:none;" itemprop="condition" content="new"></span>
	<strong>Description:</strong><br />
    <div class="proddesc" itemprop="description">Description would go here but it's so long we have removed it. </div>
</div>

Using :
itemscope http://data-vocabulary.org/Product
itemscope http://data-vocabulary.org/Offer

With:

  • itemprop name
  • itemprop image
  • itemprop price
  • itemprop stock
  • itemprop availability
  • itemprop category
  • itemprop seller
  • itemprop brand
  • itemprop category
  • itemprop identifier
  • itemprop currency
  • itemprop condition
  • itemprop description

Example 3 - Product with a single price (on sale) and reviews

Here is an example of how to get a product price a review star rating on your Google Search Listing at the same time: 



<div itemscope itemtype="http://data-vocabulary.org/Product" itemprop="itemreviewed">
<h1 class="prodname" itemprop="name">Handmade Bracelet</h1>
<h2>Sale 25% off!</h2>		
<img src="productimages/c000255/p048537_m_250pxBracelet.jpg" alt="Handmade Bracelet" name="main" class="ProductImage" id="main" itemprop="image"/>
<form id="form1" name="form1" method="GET" action="Input/AddToBasket.php?product=48537">
    <span itemprop="offerDetails" itemscope itemtype="http://data-vocabulary.org/Offer"><h3>PRICE: Was: <del>£7.20</del> Now: £<span itemprop="price">5.40</span></h3></span><br />
    <span itemprop="stock">4</span> <span itemprop="availability" content="in_stock">in stock</span>.
    Quantity: <input name="quantity" type="text" id="quantity" value="1" size="4" maxlength="4" />
</form>
<p><a href="cart.php?c=255&cat=bracelets">View other products in the <span itemprop="category">bracelets</span> category. </a></p>
<span style="display:none;" itemprop="seller">Lucy's Handmade Jewellery</span>
<span style="display:none;" itemprop="brand">Handmade</span>
<span style="display:none;" itemprop="category">Apparel & Accessories > Jewelry > Bracelets</span>
<span style="display:none;" itemprop="identifier"></span>
<meta itemprop="currency" content="GBP" />
<span style="display:none;" itemprop="condition" content="new"></span>
<div itemscope itemtype="http://data-vocabulary.org/Review-aggregate" style="display:none;">
<div itemprop="rating" itemscope itemtype="http://data-vocabulary.org/Rating"><span itemprop="average">100</span>% <span style="display:none;" itemprop="best">100</span></div>
    <span style="display:none;" itemprop="votes">3</span>
    <span style="display:none;" itemprop="itemreviewed">Handmade Bracelet</span>
</div>
<strong>Description:</strong><br />
<div class="proddesc" itemprop="description">Description would go here but it's so long we have removed it. </div>
</div>

Using :
itemscope http://data-vocabulary.org/Product
itemscope http://data-vocabulary.org/Offer
itemscope http://data-vocabulary.org/Review-aggregate
itemscope http://data-vocabulary.org/Rating

With:

  • itemprop name
  • itemprop image
  • itemprop price
  • itemprop stock
  • itemprop availability
  • itemprop category
  • itemprop seller
  • itemprop brand
  • itemprop category
  • itemprop identifier
  • itemprop currency
  • itemprop condition
  • itemprop description
  • itemprop rating
  • itemprop average
  • itemprop best
  • itemprop votes
  • itemprop itemreviewed

Example 4 - Product with multiple prices and star rating reviews

The following has multiple prices, star rating reviews and stock all in the Google Search Listings:



<div itemscope itemtype="http://data-vocabulary.org/Product" itemprop="itemreviewed">
	<h1 class="prodname" itemprop="name">Blue Shirt</h1>
	<img src="productimages/c000255/p048534_m_230pxblueshirt.jpg" alt="Blue Shirt" name="main" class="ProductImage" id="main" itemprop="image"/>
	<span itemprop="availability" content="in_stock">Available to Buy</span>
    <form id="form1" name="form1" method="GET" action="Input/AddToBasket.php?product=48534">
        <select name="AttributeID" size="4" id="Attributes">
            <option value="48857" selected="selected">Small - £13.20 [6 in stock]</option>
            <option value="48858" >Medium - £14.20 [20 in stock]</option>
            <option value="48859" >Large - £15.20 [20 in stock]</option>
        </select>
        <div itemprop="offerDetails" itemscope itemtype="http://data-vocabulary.org/Offer-aggregate">
            From £<span itemprop="lowPrice">3.20</span> to  £<span itemprop="highPrice">5.20</span>
        </div>
        Quantity:<input name="quantity" type="text" id="quantity" value="1" size="4" maxlength="4" />
    </form>
    <p><a href="cart.php?c=255&cat=shirts">View other products in the <span itemprop="category">Shirt</span> category. </a></p>
    <span style="display:none;" itemprop="seller">Shirt Shop</span>
    <span style="display:none;" itemprop="brand">Duchamp</span>
    <span style="display:none;" itemprop="category">Apparel & Accessories > Clothing > Tops > Shirts & Blouses</span>
    <span style="display:none;" itemprop="identifier">7702018977901</span>
    <meta itemprop="currency" content="GBP" />
    <span style="display:none;" itemprop="condition" content="new"></span>
    <div itemscope itemtype="http://data-vocabulary.org/Review-aggregate" style="display:none;">
        <div itemprop="rating" itemscope itemtype="http://data-vocabulary.org/Rating"><span itemprop="average">4.8</span> <span style="display:none;" itemprop="best">5</span></div>
        <span style="display:none;" itemprop="votes">12</span>
        <span style="display:none;" itemprop="itemreviewed">Blue Shirt</span>
    </div>
    <strong>Description:</strong><br />
    <div class="proddesc" itemprop="description">Description would go here but it's so long we have removed it. </div><br />
</div>

Using :
itemscope http://data-vocabulary.org/Product
itemscope http://data-vocabulary.org/Offer-aggregate
itemscope http://data-vocabulary.org/Review-aggregate
itemscope http://data-vocabulary.org/Rating

With:

  • itemprop name
  • itemprop image
  • itemprop highprice
  • itemprop lowprice
  • itemprop stock
  • itemprop availability
  • itemprop category
  • itemprop seller
  • itemprop brand
  • itemprop category
  • itemprop identifier
  • itemprop currency
  • itemprop condition
  • itemprop description
  • itemprop rating
  • itemprop average
  • itemprop best
  • itemprop votes
  • itemprop itemreviewed

Please note this one uses Offer-aggregate not Offer

Example 5 - Reviews page with review summery and list of reviews

Here is an example of having multiple reviews and an overview without a product. We have avoided listing reviews and products on the same page because our product information is far more important than the individual reviews. Because of this we only use the review summery to insure Google displays the product information rather than an individual review.



<div itemscope itemtype="http://data-vocabulary.org/Review-aggregate">
    <div>This shop is displaying 100% of their feedback <img src="i/bar1.gif" width="104" height="11" style="position:relative;" /><img src="i/bar2.gif" class="feedbar" style="width:100px;" /></div>
    <div itemprop="rating" itemscope itemtype="http://data-vocabulary.org/Rating">The average rating for all feedback is <span itemprop="average">98</span>% <img src="i/bar1.gif" width="104" height="11" style="position:relative;" /><img src="i/bar2.gif" class="feedbar" style="width:98px;" /><span style="display:none;" itemprop="best">100</span></div>
    <span style="display:none;" itemprop="count">2</span>
    <span style="display:none;" itemprop="votes">10</span>
    <span style="display:none;" itemprop="itemreviewed">Handmade Jewellery</span>
</div>
<hr />
<div itemscope itemtype="http://data-vocabulary.org/Review">
    <span style="display:none;" itemprop="itemreviewed">Handmade Jewellery</span>
    <img src="i/h5.gif" width="94" height="17" alt="5 hearts"/>  <time itemprop="dtreviewed" datetime="2011-10-14">Fri, 14 Oct - 20:06</time>
    <div><strong>The buyer said:</strong> <span itemprop="description">Quick and all that, very happy. </span></div>
    <div>Did they receive their goods within 30 days? Yes</div><div>Was the packaging good? Yes</div>
    <strong><span itemprop="rating">5</span> hearts out of 5.</strong>
</div>
<div itemscope itemtype="http://data-vocabulary.org/Review">
    <span style="display:none;" itemprop="itemreviewed">Handmade Jewellery</span>
    <img src="i/h5.gif" width="94" height="17" alt="5 hearts"/>  <time itemprop="dtreviewed" datetime="2011-10-15">Fri, 15 Oct - 20:06</time>
    <div><strong>The buyer said:</strong> <span itemprop="description">Great service. </span></div>
    <div>Did they receive their goods within 30 days? Yes</div><div>Was the packaging good? Yes</div>
    <strong><span itemprop="rating">5</span> hearts out of 5.</strong>
</div>

Using :
itemscope http://data-vocabulary.org/Review
itemscope http://data-vocabulary.org/Review-aggregate

With:

  • itemprop average
  • itemprop best
  • itemprop count
  • itemprop votes
  • itemprop itemreviewed
  • itemprop dtreviewed
  • itemprop description
  • itemprop rating

”





Be groovy and share us around:
Keep up-to-date with our news on Twitter:
You might be interested in:
You can also find us on: