Menu

Lovely Cute
  • More Menu

    • Reports
    • Search
    • Graphs
    • Settings
  • Dream Fun Product

    Drop Menu

    • Reports
    • Search
    • Graphs
    • Settings
  • Home
  • About
  • Contact
  • Sitemap
  • Others
    • Gambar Lucu
    • Infografis
    • Inspirasi
    • Motivasi
    • Photoshop
    • Teka-teki
    • Tips
    • Ucapan

Quicker BD

  • Menu
  • Home
  • Blogger
    • SEO
      • SEO 1
      • SEO 2
    • CSS
      • CSS 1
      • CSS 2
      • CSS 3
      • CSS 4
      • CSS 5
    • Jquery
      • Jquery 1
      • Jquery 2
  • Music
    • Product 1
      • Sub Item
      • Sub Item
    • Product 2
      • Sub Item
      • Sub Item
  • Flat UI
  • Features
Home » Blogger Tutorial » Blogger Widget » How-to » Add Star Ratings to your Blogger Product Review Posts

Add Star Ratings to your Blogger Product Review Posts

Google Star Rating Image
You might seen star ratings in many other big blogs where it used to show rate from their side of they reviewed the product. even it appears to the Google search result after the title of the post as well. most likely , it is used on WordPress blogs but the main thing about today's article is that i gonna share a great tutorial which let's you add star ratings to your blogger posts.

Also see : How to Add A Transparent Notification Bar To Blogger

As you can see the screenshot above to how the star ratings looks like, you can add 3 or 5 star ratings actually its up to you. but you should make sure that you are doing right. You have to rate star according to your view about the product if that product is really good and useful with the great features then you should rate it as 5 star or if you think that it isn't as good as it sound then you can go for less star However, no body will be interested in negative review.

So, here is tutorial of adding star ratings to your blogger post :
Go to blogger dashboard > posts > New post ( where you would like to have star ratings)
Change the editor to HTML mode, then scroll down to the bottom of the post.
Copy and paste below code just there and make changes according to your requirements.

<style>
.hreview{display:none}
</style>
<div class="hreview">
<span class="item">
<span class="fn">Product Name</span>
<br/>
</span><span class="reviewer">Reviewed by Your name</ span><span class="dtreviewed">
<span title="2014-03-4"class="value-title"></span>
<br/>
</span>Rating:<span class="rating">5</span>
</div>


Changes :
1. Change "Product Name" (In purple color)with the product name which you are currently reviewing.
2. Chnage "Your name" (In blue color) with reviewer name if the review is done by you then write your name.
3. Now, change review date (In red color) with date you reviewed, format is YYYY-MM-DD
4. Now last change is that ratings, change "5" with any number of star you like. but you can choose from 1-5 only.

So, guys, there were the steps of adding star ratings to your blogger post. well, after completing your post google will update on their search engine soon and then you will be able to see your ratings after the post title into Google search result as well.

If you have any questions or suggest about this article or about this blog then drop your comment on comment section below.
Add Comment
Blogger Tutorial Blogger Widget How-to

Share

Like

G+

Tweet

Tweet
Related Posts

Show Conversion CodesHide Conversion Codes
Show EmoticonHide Emoticon
Newer Older Home
Powered by Blogger.

Weekly Posts

  • How to Add A Transparent Notification Bar To Blogger
    How to Add A Transparent Notification Bar To Blogger
  • Xmas "Flying Santa Claus" Widget for Blogger
    Xmas "Flying Santa Claus" Widget for Blogger
  • Supreme V2 ( Version 2) Responsive Blogger Template Download for free
    Supreme V2 ( Version 2) Responsive Blogger Template Download for free
  • How to Add Animated Flying Android Man Widget to Blogger
    How to Add Animated Flying Android Man Widget to Blogger
  • Create a Free Blog with Blogspot.com
    Create a Free Blog with Blogspot.com
  • How to Embed YouTube Videos In Blogger Posts
    How to Embed YouTube Videos In Blogger Posts
  • Use A Drop Cap Large First Letter In Posts On Blogger
    Use A Drop Cap Large First Letter In Posts On Blogger
  • Download Best and SEO Friendly Blogger Templates for your Blog
    Download Best and SEO Friendly Blogger Templates for your Blog
  • Flash SWF file Embed Code Generator
    Flash SWF file Embed Code Generator
  • Simple Recent Posts Widget for Blogger / Blogspot
    Simple Recent Posts Widget for Blogger / Blogspot

Blog Archive

  • ►  2017 (2)
    • ►  October (1)
    • ►  May (1)
  • ►  2016 (5)
    • ►  October (1)
    • ►  September (1)
    • ►  March (1)
    • ►  February (2)
  • ►  2015 (28)
    • ►  November (1)
    • ►  September (7)
    • ►  August (2)
    • ►  July (1)
    • ►  June (1)
    • ►  April (3)
    • ►  March (3)
    • ►  February (5)
    • ►  January (5)
  • ▼  2014 (105)
    • ►  December (4)
    • ►  November (6)
    • ►  October (1)
    • ►  September (8)
    • ►  August (12)
    • ►  July (14)
    • ►  June (5)
    • ►  May (11)
    • ►  April (5)
    • ▼  March (15)
      • jQuery Facebook Popup (Like Box Widget) V2
      • How to Open All Blogger Links in New Tab Using CSS
      • Add Labnol.org style Facebook Like Box to Blogger
      • How to Add Custom jQuery Lightbox to Blogspot blog
      • How to Add Animated Flying Android Man Widget to B...
      • How to Add Breadcrumb to Blogspot Blog
      • How to Add Official Contact Form to a Specific Pag...
      • How to Add Official Contact Form Widget to Blogspo...
      • Add Mashable Style Social Subscription Widget to B...
      • Android Act - Download Free Responsive Blogger Tem...
      • Beautiful Social Count Widget for Blogger Blogspot
      • How to Add Smileys & Emoticons inside Blogger Comm...
      • Add Star Ratings to your Blogger Product Review Posts
      • How to Add A Transparent Notification Bar To Blogger
      • How to Add CSS Drop Down Menu To Blogger
    • ►  February (24)

Labels

  • Facebook
  • twitter
  • googleplus
  • linkedin
  • youtube
  • flickr
  • vimeo
  • deviantart

Copyright Quicker BD 2018

Published By Gooyaabi Templates