If You Want Adsense Approval for your blog JOIN US Adsense Ready theme Now!

How to Add Counter View in Blogger Posts

Counter view in blog posts certainly has a function to let visitors know which articles have been viewed the most so that they know that the article


 Counter view in blog posts certainly has a function to let visitors know which articles have been viewed the most so that they know that the article is really useful.

I have searched several articles about adding Counter view in posts to blogger and mostly to no avail. If so, you can follow the tutorial I gave below.

How to Add Blogger Counter View

Here are the steps in creating a view counter on blogger, please read carefully:

1. Login to Blogger, go to TEMA, then select Edit HTML.

2. Make sure you have installed Jquery Library and Font Awesome in your blog template if not then paste it right under all meta tags or right under tags <head>

<!-- Jquery Library and Font Awesome CDN -->
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'/>
<link crossorigin='anonymous' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css' integrity='sha256-46qynGAkLSFpVbEBog43gvNhfrOj+BmwXdxFgVK/Kvc=' rel='stylesheet'/>


3. Copy the code below and paste it before the tag <data:post.body/>

<b:if cond='data:view.isPost'><span class='post-view' expr:data-id='data:post.id'><span class='view-load' id='postviews'><i class='fas fa-spinner fa-pulse faa-fast'/></span>Views</span></b:if>
4. Then, paste this script above the tag </body>
<script type='text/javascript'>
/*! Firebase-post-view */
jQuery.getScript("//cdn.firebase.com/js/client/2.3.2/firebase.js").done(function(){$.each($(".post-view[data-id]"),function(e,a){var i=$(a).parent().find("#postviews").addClass("view-load"),t=new Firebase("https://md-count-view.firebaseio.com/pages/id/"+$(a).attr("data-id"));t.once("value",function(e){var o=e.val(),d=!1;null==o&amp;&amp;((o={}).value=0,o.url=window.location.href,o.id=$(a).attr("data-id"),d=!0),i.removeClass("view-load").text(o.value),o.value++,"/"!=window.location.pathname&amp;&amp;(d?t.set(o):t.child("value").set(o.value))})})});
</script>
5. When finished, click SAVE.

Please see the current appearance of your blog whether Counter view has been installed in the post.

Well, that's a short tutorial this time about How to Add Counter view in Blogger posts for those of you who are still confused or have other questions about blogger, please comment in the comments column below this article.

2 comments

  1. THANKS ALOT
  2. Thank you for your article on How to Add Counter View in Blogger Posts
    Chris Owner CEL Financial Services IRS Registered Tax Preparer Registered bonded California CTEC Tax Preparer https://incometaxprepfillmore.com
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.