Hello Bloggers, in this tutorial I will share with you all how to create a star rating widget in blogger. Installing a star rating widget in each blog post on your website will look more professional, plus it can also serve as an assessment of the views of visitors about the content of your website and domain while increasing SEO on Google search.
Benefits of star rating
It increases the trust of your visitors on your site
Users can estimate how much that product is worth without reading the whole review.
Increases traffic to the site
Provides value to your clients
Provide an Amazing and attractive look to your site
How to Create Star Rating in Blogger?
Step 1: Visit the WIDGET PACK website then select Sign Up to register an account.
Step 2: Add your website.
Step 3: on the left, you can show three lines click on it and then click on "Rating", then select "Install".
Step 4: Copy the JavaScript from <script type = "text / javascript"> ... </script>
now search </body>
tag in blogger theme and paste code into the </body>
tag.
For Example:
<script type="text/javascript">wpac_init = window.wpac_init || [];
wpac_init.push({widget: 'Rating', id: 34075});
(function() {
if ('WIDGETPACK_LOADED' in window) return;
WIDGETPACK_LOADED = true;
var mc = document.createElement('script');
mc.type = 'text/javascript';
mc.async = true;
mc.src = 'https://cdn.widgetpack.com/widget.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(mc, s.nextSibling);
})();
</script>
Step 6: now search <data:post.body/>
tag in your blogger template and paste this HTML under the <data:post.body/>
tag.
<div id="ratings" style="width:96%; height:100px; text-align:center; border:3px solid #e6e4df; margin:0 auto; margin-top:10px"><h4>Your review of this article?</h4>
<p id="wpac-rating"/>
</div>
Step 6: Go back to the Widget Pack website and edit widget Rating Settings.
Step 3: Select the Menu → Rating → Setting to set the rating properties and then Save again:
Enable Google Rich Snippets for Ratings: Whether or not ratings appear on search results
Vote via: How to evaluate
Socials: Social networks
Colour: Star colour
Stars: Number of stars
Height: Height in px
Congratulations 🥳 now star rating is added to your site!
Must Check: Broken bio for Instagram
Conclusion
Hope this tutorial will help you to understand how to apply the star-ratings function on your Blogger! Please let me know what you think about this post by leaving your comments below. And if you need any help ask below in the comment section.