How To Add Star Ratings In Blogger 2021

How To Add Star Ratings In Blogger 2021
Best Way To Add Star Ratings In Blogger 2021

If you want to add a star rating to your blogger then this post is for you. With the star rating, you get to see the extra effect in your blog. Your blog gets extra trust due to the star rating. It also increases your SEO score.

Star rating is a widget with the help of which you can add rating widget to your blog and it is absolutely free.

Let’s start.

How To Add Star Ratings In Blogger 2021:- Step- By-Step Guide

  • First step, You have to go to the rating widget(🔗) website and create your account on the rating widget site as well as verify the email.
  • Next, open the Rating menu in ” https://rating-widget.com/get/rating/ “, then customize the appearance of the rating widget as needed.
Star rating widget
Star rating widget
  • After the customization is finished, copy the code and add it before the </body>. Examples-
<script type="text/javascript">(function(d, t, e, m){
    
    // Async Rating-Widget initialization.
    window.RW_Async_Init = function(){
                
        RW.init({
            huid: "415011",
            uid: "27f083ab12c4b82e452ba95052cb40ba",
            source: "website",
            options: {
                "style": "oxygen",
                "isDummy": false
            } 
        });
        RW.render();
    };
        // Append Rating-Widget JavaScript library.
    var rw, s = d.getElementsByTagName(e)[0], id = "rw-js",
        l = d.location, ck = "Y" + t.getFullYear() + 
        "M" + t.getMonth() + "D" + t.getDate(), p = l.protocol,
        f = ((l.search.indexOf("DBG=") > -1) ? "" : ".min"),
        a = ("https:" == p ? "secure." + m + "js/" : "js." + m);
    if (d.getElementById(id)) return;              
    rw = d.createElement(e);
    rw.id = id; rw.async = true; rw.type = "text/javascript";
    rw.src = p + "//" + a + "external" + f + ".js?ck=" + ck;
    s.parentNode.insertBefore(rw, s);
    }(document, new Date(), "script", "rating-widget.com/"));</script>

To make this code clean, here clean Code look like this.

<script type='text/javascript'>
//<![CDATA[
!function(e,t,n,i){window.RW_Async_Init=function(){RW.init({huid:"415011",uid:"27f083ab12c4b82e452ba95052cb40ba",source:"website",options:{style:"oxygen",isDummy:!1}}),RW.render()};var s,a=e.getElementsByTagName(n)[0],c="rw-js",r=e.location,o="Y"+t.getFullYear()+"M"+t.getMonth()+"D"+t.getDate(),d=r.protocol,g=r.search.indexOf("DBG=")>-1?"":".min",l="https:"==d?"secure."+i+"js/":"js."+i;e.getElementById(c)||((s=e.createElement(n)).id=c,s.async=!0,s.type="text/javascript",s.src=d+"//"+l+"external"+g+".js?ck="+o,a.parentNode.insertBefore(s,a))}(document,new Date,"script","rating-widget.com/");
//]]>
</script>

Change in the section marked with your blogs Add your Widget Rating huid Id and udi Id

Then add the HTML code below before the code for the position above or after for the position below after the content of the article

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="rw-ui-wrap">
<div class="rw-ui-container"></div>
</div>
</b:if>

To make it clean, add this CSS code before

<style type='text/css'>
.rw-ui-wrap {margin:0 auto 20px auto}
</style>

Done.

0 Shares:
0 Share
0 Share
0 Tweet
0 Share
0 Share
0 Share
Leave a Reply

Your email address will not be published. Required fields are marked *

You May Also Like