How to Add - Star Rating Widget to Blogger?

Is your blog post effective? Does your reader really like your post? Are they satisfied with the post content and get benefited? All these questions are very important for Blogging career and would help the bloggers to come up with good posts. Usually any blog template comes up with comments section which is used for feedback from the readers online. But not all the readers would like to write comments on blog posts. It would be better to add some simpler feedback option on blogger. This can be achieved by adding Star Rating to your blog posts. Star Rating is very easy to use and more easier way to provide feedback from readers. The star rating will have 5 stars that reflects the blog post's effectiveness. Star Rating can be added to blogger through Rating Widget.

Rating Widget provides so many beautiful star rating plugins. You can enjoy the power of Rating Widget's Rating System which makes the blog posts most beautiful. 

Let us see the process of adding Star Rating widget to Bloggger.



1. Go to: http://rating-widget.com/

2. Select the available options mentioned below and click the button "</>Get Widget"

Type = Star
Theme = Select your favorite theme from the list of themes
Size = Size of the star




3. Click the button "Generate User-Key >>" and then enter Email id and Secure code and click "Submit" button.



4. Save User Key and User ID generated for future use.
Then click the button "Add to Blogger" highlighted below which would ask for which blog you want the star rating to be added (all the blogs corresponding to the Email id provided in the previous step will be displayed here to select any one of them).



5.  Select the blog and click "Add Widget" which will redirect to the Blogger Layout page.



6.  A HTML/JavaScript widget should get added to blogger as highlighted below.



7. Save and View blog to see the changes.




Now you can see a Star rating on blogger.

================================

NOTE: If your blog template is not a standard blogger template, then the above approach will not work. In case of non-standard blogger template, we need to follow a different approach to get the star rating widget added to the blog. Follow the steps mentioned below to add star rating for a non-standard blogger template.

1. Go to: Dashboard -> Template -> Edit HTML
(ensure you have checked "expand widget templates" box)

2. Search for the below code.
<div class='post-footer-line post-footer-line-1'>
OR
<p><data:post.body /></p>

3. Immediately after the the above searched code, paste the below mentioned code.

<b:if cond='data:blog.pageType == "item"'> <span class='star-ratings'> <b:if cond='data:top.showStars'> <div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'/> </b:if> </span> </b:if>

4. Now search for the below code.
<b:include name='nextprev'/>

5. Paste the below code immediately after <b:include name='nextprev'/>

<b:if cond='data:top.showStars'> <script src='http://www.google.com/jsapi' type='text/javascript'/> <script type='text/javascript'> google.load("annotations", "1"); function initialize() { google.annotations.createAll(); google.annotations.fetch(); } google.setOnLoadCallback(initialize); </script> </b:if>

6. Save Template and View blog to see the Star Rating added to the blog.


If you like the post, take a couple of minutes to comment and share.
Your comments are most valuable and would help me come up with better posts.