How to Add Star Rating to Blogger Blog Posts

This article is about how to add star rating widget to blogger blog. This is really an excellent and attractive widget for the blogger. Your readers must like this type of widget. In WordPress, we can easily add star rating below or above our posts, we use the plugin to add the star rating. In blogger, you need to add this widget manually by adding some code on your HTML page. You need to know how to add star rating to blogger blog posts.

How to Add Pinterest Pin It Button to Blogger Blog Images

If you add star rating below blog posts, it will be helpful to get good user experience. They will easily rate your blog posts. Star rating looks like below.

Add Star Rating to Blogger Blog

Many of us may want to know why we should add the star rating to blogger blog. I want to say them that the star rating widget is not very much important. You must add this to your blog post I did not say that. But you can add this widget because it has some facilities. Some of us want to know to add the star rating to blogger blog posts. So I write this article to help them.

Fix Duplicate Meta Description in Blogger:Posts/Homepage

The star rating increases the faith of your visitors on your products, you will get more traffic, readers can justify your contents by seeing the star rating, readers rate your content if you have a star rating.

This article simply shows you how to add star rating to blogger blog posts.

Add These Important Widgets for Blogger Blog

Add Star Rating to Blogger Blog Posts

  • Go to blogger blog Dashboard. Then click on Template >> Edit HTML.

Add Star Rating to Blogger Blog

  • Now press Ctrl+F from your keyboard  for search box. Then find the </head> tag. Then paste the below code just before </head> tag.
<link type="text/css" rel="stylesheet" href="http://static.graddit.com/css/graddit.css" />
  • After doing that. Now again find this tag <data:post.body/> on Edit HTML page.
  • Now paste the below script just above or after the  <data:post.body/> tag.

If you want to add the star rating above your post then paste the code just above <data:post.body/>.

If you want to add star rating below your post then paste the code just below <data:post.body/>.

I prefer to add the below of posts. Because it helps sthe readers to rate your posts properly.

The code is below:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'><div expr:id='"labels_" + data:post.id' style='display: none; visibility: hidden;'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/>,</b:loop></b:if></div>Rate this posting: <div expr:id='data:post.id' class='ffbs_rate'>{[[&#39;&lt;img src=&quot;http://static.graddit.com/img/star.png&quot;/&gt;&#39;]]}</div><div expr:id='&quot;ffbs_stats_&quot; + data:post.id' class='ffbs_stats'></div><script type='text/javascript' expr:src='&quot;http://www.graddit.com/rate/eng/5/&quot; + data:post.id + &quot;?id=&quot; + data:post.id + &quot;&amp;stats=ffbs_stats_&quot; + data:post.id + &quot;&amp;labels=labels_&quot; + data:post.id + &quot;&amp;info=info-&quot; + data:post.id + &quot;&amp;info_delay=2&amp;url=&quot; + data:post.url + &quot;&amp;class_star=ffbs_star_img&amp;class_star_set=ffbs_star_img_set&amp;class_star_vote=ffbs_star_img_vote&amp;views=yes&amp;votes=yes&amp;average=yes&quot;'></script></b:if>
  • Finally, click on Save Template. Tha’s all. You have done.

Hope now you knwo how to add star rating to blogger blog posts. This really a fantastic feature of blogger. Enjoy yourself.

Munna Hossain
 

Hello, I am Munna Hossain. I am a professional blogger and affiliate marketer. I am interested in technology, blogging, SEO, and WordPress. My blog Mytechgoal provides you all information about technology, blogging, SEO, and affiliate marketing.

Click Here to Leave a Comment Below 0 comments