Star Rating in Blogger

As I mentioned in 5 Blogger Widgets star ratings widgets are a good way to get feedback.
Blogger has made available its own star ratings.

Here’s how you can add star ratings widget:
1. Sign in at Blogger in Draft
2. Go to Layout and then click edit on the Blog Posts

3. check the textbox before star ratings

and then you will see this below your posts

But this widget may not show if you have used a custom template. To add the star ratings widget you will have to do the following:

1. Go to Layout->Edit Html
2. Download Full Template
3. Check the Expand Widget Templates
4. Search for the post-footer the code may look like this

<div class=’post-footer’>
<p class=’post-footer-line post-footer-line-1′>

5. Just below the highlighted code paste this code

<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=’280′/>
</b:if>
</span>

6. Now search for

<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’>

and then find its closing tag /b:widget the code will look like this:

</b:includable>
</b:widget>

7. Just above the highlighted code paste this code

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

This code will ensure that the star ratings are displayed.