Do you know how anyone knows if the article they are reading is useful or not?
There are many factors that determine whether an article is useful or not and one of them is how many ideas this article has received. In simple words, how many people have read this article?
All you have to do is install a plugin to display a page or post view in WordPress and you will see post views on your post pages.
But it is very difficult for bloggers but there is nothing to worry about. I am here to solve all your problems and all your problems related to bloggers.
Today in this article I am going to tell you how you can add post view functionality in Blogger.
I always try to give you a demo of the things I share on this blog and if you want to see a demo you can see it at the beginning of this article just above the thumbnail of this article you see We will find out how many ideas there are in it.
The demo looks like something you can see below.
In WordPress, you have to buy hosting and you can build a database in this hosting but for Blogger, you don't have to buy any hosting but we will need a database to see the counter functionality of this page.
Don't worry you won't have to buy hosting we will use Firebase which provides us free database management system and we can create the maximum database which we want free without paying 100% Are
How to implement this functionality in Blogger is somehow difficult, so I have created a separate video that you can easily watch the anti-post view functionality on the Blogger website.
I have explained everything in this video you can only watch this video on my youtube channel but for your convenience, I have put this video at the very bottom
Code to get Blogger Post ID.
<div expr:post-id='data:post.id'/>
You have to add the above code after the below code.
<b:includable id='post' var='post'>
Code to display page views.
<style>#views-container #page-views{margin-left:5px}</style><span id="views-container"><i class="fa fa-eye"></i><span id="page-views"></span></span>
Database Connection & all functionalities Code paste it just above </body> tag.
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'></script><script>//<![CDATA[const convertSize=function(t){const o=["","KB","MB","GB","TB"];if(0==t)return"0";const n=parseInt(Math.floor(Math.log(t)/Math.log(1024)));return 0==n?t+" "+o[n]:(t/Math.pow(1024,n)).toFixed(1)+" "+o[n]};$.each($('div[post-id]'), function(i, e) {var blogStats = new Firebase("https://posts-views-1.firebaseio.com/pages/id/" + $(e).attr('post-id'));blogStats.once('value', 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('post-id');isnew = true;}$("#page-views").text(convertSize(data.value));data.value++;if(window.location.pathname!='/'){if(isnew)blogStats.set(data);elseblogStats.child('value').set(data.value);}});});//]]></script>
