Add Post Views Counter in Blogger Posts

Read Also

Add Post Views Counter in Blogger Posts. We are sharing the method of adding blogger post views counter in blog post header line. Its a simple method. You have to follow 2 simple steps.

Add Post Views Counter in Blogger Posts

Follow the below two steps to acquire the best results.

Steps 1

Find <b:include data='post' name='postQuickEdit'/> in your template html.
Add below html line just above it.

<a expr:name='data:post.id'/> <i class='fa fa-eye'/> <span id='postviews'/>

Now go to firebase and create project.
after creating project just copy firebase URL which you have to replace in below script.wait for it.

Step 2

Now add below script just before </body>.

<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($(&#39;a[name]&#39;), function(i, e) {
var elem = $(e).parent().find(&#39;#postviews&#39;);
var blogStats = new Firebase(&quot;https://adeelstriker-e62e5.firebaseio.com/pages/id/&quot; + $(e).attr(&#39;name&#39;));
blogStats.once(&#39;value&#39;, function(snapshot) {
var data = snapshot.val();
var isnew = false;
if(data == null) {
data= {};
data.value = 0;
data.url = window.location.href;
data.id = $(e).attr(&#39;name&#39;);
isnew = true;
}
elem.text(data.value);
data.value++;
if(window.location.pathname!=&#39;/&#39;)
{
if(isnew)
blogStats.set(data);
else
blogStats.child(&#39;value&#39;).set(data.value);
}
});
});
</script>

Now just replace the highlighted line with your firebase URL.
Thanks.
Comment us if you have any difficulty.