August 11, 2012

How to Display Review Markup Star Rating In Google Search Results

Are you still thinking that there is no way to get yourself featured on Google Search engine? Have you ever seen those websites in Google Search results that have 5 little review stars on it? Review Markups is the permit that will make your website different from everyone. Just like the Google Verified author has significance in SERP in the same way Review markups provides reputable impact to the searchers. If we go in depth, Review Markups is more commonly known as the search engine star rating system which not only creates a positive impression in the minds of your visitors, but also make your website stand out in the search results. So, if you willing to improve the appearance of your Blog in Google Search engine then Review star markups is the receipt to get yourself highlighted in Search results. 

I know you are curious to check how your post will look once you applied the following tutorial so here is the live demo.

Reasons Why You Should Use Review Markups Star Rating in SERP

Before we jump onto our tutorial, let us study few features of Review Markup plugin.
  • Whenever, a person searches a certain keyword in Google his aim is to get the desirable result in just one click, and by placing review stars, we are allowing users to get to a place which has the most perfect knowledge.
  • By adding review markups in a certain post you are telling visitors that it is a trusted page and the information present in this page is worthwhile.
  • You will receive more traffic because you have the most unique presentation in the SERP with Review Markups.

How to Install Review Markup in Blogger Post:

Installing review markup in WordPress Blog is extremely straightforward then installing it in Blogger, because there are numerous Plugins available which makes everything possible in WordPress. However, blogger don’t have robust plugins so here we will take help of chunk of HTML coding that will work as perfect as the Plugins available in WordPress.
  • Step#1: Go To Blogger.com >> Add a Post >> HTML Tab
  • Step#2:  Then copy and paste the following HTML code in HTML tab of Blogger post editor.
<div class="hreview"> <span class="item"> <span class="fn">Name-Of-Product-(You are reviewing)</span><br/> </span> Reviewed by <span class="reviewer">Reviewer-Name-Here</span>on <span class="dtreviewed">Aug 11 2012<span title="2012-11-08" class="value-title"></span><br/> </span> Rating: <span class="rating">Your-Stars</span></div>
Customization:  
  • Replace Name-Of-Product-(You are reviewing) with the title/name of product that you are reviewing.
  • Replace Reviewer-Name-Here with your name that you want to see in Search results.
  • Replace Aug 11 2012 with the current date along with 2012-11-08  in YY-MM-DD  format.
  • And the last but not the least, replace Your-Stars with the number of your ratings. Mean how many stars you want to give to your product but keep in mind, that you must have to give review out of 5.
All Done: Now finally publish your post and wait till Google bots crawl your website. It totally depends on your new post indexation, if your new posts are index within 2 minutes then you can see those review starts on the specific post.

Using Google Rich Snippet Tool For Verification:

Google Introduced Rich Snippets Tools so that bloggers and webmasters can preview how their Blog or Website URLs would appear in Search engine result, but still majority of the bloggers are still unaware of this tremendous tool.
  • Step#3:  Now, the next step is to verify that you have done everything correctly? So, to do so use the Google Rich Snippets Tool to see how your post result will look in Google. One more thing keep in mind that you have to do so with each post individually. And the rating words will also appear at the end of your post.
From The Editor's Desk: 
Hope you will like my first tutorial on MBL (My Blogger Lab). Leave your precious comments and questions (if you have any). Till then Peace, blessings and Happy Staring.

31 comments:

  1. Hi Saqib, I just want ask you. Should I put the code at the beginning of post or end of post?

    Nice Tutor thanks :)

    ReplyDelete
    Replies
    1. Dear Danial Thanks For Arising The Question. Actually I Forget To Mention In The Post, You Have To Put The Code At The End Of The Post In HTML Section. Have Peace And Blessings Pal :)

      Delete
  2. Replies
    1. Thanks For Giving Your Review.. Have Peace And Blessings :) Be Happy

      Delete
  3. OMG! We can also do this in blogger! Cool. ;)

    Don't you think u have to add some css so it will looks pretty good after post!?

    ReplyDelete
    Replies
    1. Ammar! Thanks for the Suggestion! we will soon update the coding with stylish CSS (Style Sheet)

      Delete
  4. True.. I thought it was kinda useless. Wish i was wrong.. :)

    ReplyDelete
  5. Hello,

    Great Article! it will good to put this piece of code in a regular html page? google will add the stars in the search results?

    Thanks

    ReplyDelete
    Replies
    1. Yes This Markups Will work Perfectly With any HTML Pages. Feel Free To try Peace

      Delete
  6. Thank you! I'm using Wordpress but I needed the HTML markup code for this. You're the best!

    ReplyDelete
    Replies
    1. Oh I am Pleased to you, We Help you. Thanks for the Visit. Peace and Blessings

      Delete
  7. Hey Syed, nice tutorial.
    But what if I don't want the rating words to appear at the end of the post. Any way to do that?

    ReplyDelete
    Replies
    1. Just changed the font color to match the background color ;)

      Delete
  8. i just want to know, its not possible to add this code older posts, is there any other method to display the rating for all posts (including older posts)...???

    ReplyDelete
    Replies
    1. Yeah Sathish, You can also use them in your older post. And Whenever, Google will Re-Crawl Those Pages they will add the Star Rating to the Search engine. Hope that Helps. Peace

      Delete
  9. Hi Saqib your post helped me a lot...
    but got a question hope you only can solve it!

    as per your instruction when i placed the code at the end of html of my blog post it is showing fine in snippet tool i am happy with that.

    but when i checked for home page url in snippet tool it is showing the same review markup for homepage also...

    i only want my hreview markups to be shown for blog posts where i use not for entire blogspot.com.

    please test my urls in rich snippet tool
    http://sureshacadtips.blogspot.in/------------homepage url

    http://sureshacadtips.blogspot.com/2012/11/staff-selection-commission-ssc-was-set.html------------------blog post url

    hreview snippet is same for both urls
    please help me in solving this

    ReplyDelete
    Replies
    1. To solve this problem do as Followers.

      Go To Blogger >> Your Post >> HTML TAB >> Paste the Following Coding.

      <b:if cond='data:blog.pageType == "item"'>

      WIDGET CODE GOES HERE

      </b:if>

      Add review markup coding in between to lines and it would only show it on post pages. Peace

      Delete
  10. i tried its not working...thanks for the information

    ReplyDelete
    Replies
    1. I've tried and didn't worked for me.

      Everything done as your instructions..

      Delete
  11. Thank you man...
    After looking up for some code in google,
    Only this blog can describe it clearly..

    ReplyDelete
  12. It didn't work on some post, pls help.. why? im sure all post on my blog has been recrawled, though

    ReplyDelete
    Replies
    1. You can Always Check it through Rich Snippets Testing tool. If its working fine there, than wait for a while. You will soon see them on the Search results.

      Delete
  13. Ok, btw thanks alot for this blogger star ratings code it really helped me :)

    ReplyDelete
  14. have you any idea or how to put this automatically on each post?

    ReplyDelete
  15. Hi,How can I use this feature in a specific content management system that I built from scratch?

    Thanks,
    Ali

    ReplyDelete
  16. Successfully integrated to my blog. Thanks it really helped a lot!!

    ReplyDelete
  17. Please, give a way to use the Event rich snippets in blogger....plz..plz....plz

    ReplyDelete

We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.