in , , ,

Post View Counter for Blogger 100% Working

Post View Counter for Blogger 100% Working,Keyword, ,are blogger stats accurate, ,blogger visitor tracking, ,how to check number of views on blogger, ,blog view, ,hit counter, ,how to add total page view counter on blogger, ,mybloggeraide, ,blogger statcounter, ,download counter plugin blogger, ,visitor counter html code, ,blogger stats explained, ,visitor counter for blogger, ,what is counter blogging, ,free blog counters, ,how to check blog traffic,View Count For Posts,mashbyte,cobiegh

Dear MashByte Readers I’ve been looking for some articles about adding post views to blog post but  most of them aren’t working. What Counter view does is to display the number of views of an article . it also  has the benefit of making visitors know which articles are most viewed so that  they can  know that the article is really useful. Now to start lets follow the steps below……

The steps involved in creating a view counter on blogger:

HOW TO ACCESS THE FRAMEWORK?

  1. Go To Blogger.com 
  2.  Select Your Blog.
  3.  Select Theme >>  Always Remember to Backup first!!!
  4. Then click on the arrow near ‘Customize’ and click on Edit HTML

Make sure you have installed Jquery Library and Font Awesome CDN on your blog if not then paste it just below all meta tags or just below <head> tag.

<!-- 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 below code then paste it before <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>Total Views</span></b:if>

4.Paste This Script above in your HTML or /Body tag as shown below.

<script type='text/javascript'>
/*! MashByte-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>

Once everything is done, Save the template.. and view a post to see the view counter

I hope you find this useful, but if in any case you find it difficult to apply it to your site, then leave a comment below for help and a quick reply, or use our Contact page for a personal assistant.

Note: You have the right to share this with anyone of your choice or on your blog….but Don’t forget to link back to MashByte.com…. Read our ToC  or our DMCA here to understand how our Terms very well.

Remember to Subscribe and  share……. 

What do you think?

Written by Kwabena

Kwabena is a tech freak, passionate about every new gadget and technology that comes his way. Always searching, always curios, he managed to gather an astounding experience that is very useful in his Info-Tech career.....
You can reach him by using any of his Social Media Handles below

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

GIPHY App Key not set. Please check settings

How to Install Anti Copy and Paste on Blogger Amp theme

How To Add Download Button With Adsense Code for Blogger