How To Add 5 Star Rating Widget For Blogger & Wordpress

Hello Friends! Today i will share an amazing and most wanted tips for Bloggers. As we all know blogging is most widely used social platform today. Blogging gets more user attraction then any other social media like Facebook,twitter, Whatsapp, etc.

Now i have decided to give you my top 10 blogger widget. Today i am writing an article on Rating widget for blogger. Yes you heard right im am telling the truth 😜 I knew you all see this in Wordpress blogs and Big websites. After reading this post you'll also be able to add 5-Star Rating Widget on your blogger blogs and make it more attractive among your friends. This will improve your blog interface and visitors will love this.

Also Read: Top 5 Reasons Why Blogging Is So Much Better Than A “Traditional” Job

The rating widget will look like this as shown below:

Now Lets Begin To The Main Thread

Starting from here! I have given the steps to add this widget in your blogger/wordpress account. Strictly follow my words, else you'll not be able to see the widget working on your blogger/wordpress account.

Step 1: First click on Rating Widget website and wait for the page to load.

Step 2: Now click on Get mt free widget

Step 3: Now click on Javascript from the bundle of options.

Step 5: Now you'll be forced to Register/Login. Juts do follow the step and you'll see the code like this.

Step 6: Now open Blogger and login with your credentials.

Step 7: After Logged on your Blogger, Click on Theme like shown below.

Step 8: Now click on Edit HTML option.

Step 9: You'll see a template editor on your browser window like this.

Step 10: Now search for this code: </body> and copy the below code & paste it above </body>

	<script type="text/javascript">(function(d, t, e, m){

	// Async Rating-Widget initialization.
	window.RW_Async_Init = function(){

	RW.init({
	huid: "339581",
	uid: "16317da7370057d86c57d8b1a3d8210e",
	options: { "style": "oxygen" }
	});
	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>

view raw 5 star widget.txt hosted with ❤ by GitHub

Step 11: Now search for this code: <h1 class='post-title entry-title'> and paste the below code just after </a>

view raw 5 star widget.txt hosted with ❤ by GitHub

Step 12: Save your template and see the magic.
Also Read: Stylish Themed Sitemaps for Bloggers

Final Words:

This article has been tested and verified by me (+Sunmughan Swamy) before posting here. So please don't dare to copy this. 😜
Must Read: Change 'Back To Top' Button to Moving Rocket Effect on Blogger/Blogspot
If you like this article please rate it and comment below!