How to Install Anti-Adblock Script in Blogger

 How to make View Counter in Plus UI Blogger Theme

Do you want to track the number of views on your Blogger blog posts? In this tutorial, we'll show you how to add an automatic view counter to your Blogger theme, letting you and your readers know how popular your content is. Follow along step by step and see how easy it is to add this useful feature to your blog. Let's get started!

Adding an automatic view counter to your Blogger theme is a simple process that can be done in just a few steps. Here are the details on how to do it:

1.Make a Database on Google Firebase-

To get started, create a new project in Google Firebase by visiting the Firebase Console page and clicking "Create a Project." Then enter the desired project name and click “Continue” to proceed. [check image]

After creating a project name, leave the default settings as they are and click "Continue". To configure Google Analytics settings, click "Choose an account" and select the Google Analytics account you want to use, then click "Continue."

Now click and create project and it will take few seconds.

Now click Continue.

Hooray! Your project is ready to use. Click now and Real time Database

Click on Create Database. And select any database location. I am selecting United States (us-central01). After this select Lock Mode and click on Enable.

Now click on Rules. [view image]

After that remove all the rule codes and paste in the rules section below the rule code. [view image]

Rules JSON Code

    	 {
  "rules": {
    ".read": true,
    "BlogID_0000000000000000000": {
      ".read": true,
      "$post_id": {
        ".write": "newData.exists() && (data.exists() ? newData.val() == data.val() + 1 : newData.val() == 1)",
        ".validate": "newData.isNumber() && newData.val() % 1 === 0.0 && newData.val() <= 99999999"
      }
    }
  }
}
	

Don't forget to change BlogID. Replace BlogID with Your BlogID

Blogger Template Setup

Now open your Blogger theme xml file Editor and find Realview. The code look like below.

    	 realViews: {
  databaseUrl: "",
  abbreviation: "false"
}
	

Now add the database url inside the quotation. Also change the abbreviation flase to true. After that the code will look like this

 realViews: {
  databaseUrl: "https://xxxxxxx-xxx-xxx-default-rtdb.asia-southeast1.firebasedatabase.app",
  abbreviation: "true"
}	

That's it! Save the template and check if the views counter is working by visiting the URL or article on your website.

Conclusion

Finally, adding a real-time view counter to a Blogger theme can be achieved using JavaScript and the Blogger API. This process involves creating a JavaScript function to retrieve the current view count and update the counter on the page, and then calling the function using an event listener on the page. Additionally, it is also necessary to set a Blogger API key to access view count data. This process can extend the functionality of a Blogger theme and provide an engaging user experience by displaying the current number of views on a post or page.