Skip to content Skip to sidebar Skip to footer

Editor Post Counter Blogger

I wonder is it possible to show number of post posted by editor I have other editor with me on blogger so I want to show under every editor the number of post he posted. like this

Solution 1:

This could be a solution, you could add a Blog Widget and calculate the post like in this demo. In this solution you need to "hardcode" the Author Names(here for the Demo Author1 and Author2).

<b:widget id='Blog2' locked='false' title='Blogposts' type='Blog' >
  <b:includable id='main'>
    <script>
      <b:with var='firstAuthorPosts' value='data:posts filter (p =&gt; p.author.name == &quot;Author1&quot;)'>
         var author1 = <data:firstAuthorPosts.size />;
       </b:with>    
       <b:with var='secondAuthorPosts' value='data:posts filter (p =&gt; p.author.name == &quot;Author2&quot;)'>
         var author2 = <data:secondAuthorPosts.size />;
       </b:with>    
       window.addEventListener("load", function(){
         // here write this info into the HTML
         alert(`Author 1 has: ${author1} Posts and Author 2 has: ${author2} Posts`);
       });
     </script>
  </b:includable>
</b:widget>

to add the Post to the HTML you would have to use some javascript, but how this is done depends on the HTML your template generates.

Here a lambda function is used to filter posts from specific Auhtor and the get the amount with the size Post - Array Metadata.
(It is done twice since it is for two Authors)
the window.addEvnetListener Event is added, to write the Data into the alert (in your case then the HTML-DOM)

More detailed information to the used Blogger Syntax can be found here: Unofficial Documentation

Update: Javascript Details

  • <b:with var='firstAuthorPosts' ... creates a variable with the name firstAuthorPosts
  • ... value='...'> ... set's the value of the variable
  • data:posts ... blog-widget-variable for all posts.
  • filter ... is a lambda function for arrays, that returns only elements, where the past in function returns true
  • (p =&gt; p.author.name == &quot;Author1&quot;) ... is the function, that will be executed for each element in the array, and returns only

So <b:with var='firstAuthorPosts' value='data:posts filter (p =&gt; p.author.name == &quot;Author1&quot;)'> creates a variable and sets the value to all posts of the author with the name Author1.

  • <data:firstAuthorPosts.size /> ... returns the size/count of all posts in the array firstAuthorPosts

So var author1 = <data:firstAuthorPosts.size />; creates a javascript variable, that will be set to the count of all posts of the author Author1.

The following three lines, are the same for the Author2

  • creates a load eventHandler, for when the Website is loaded
    window.addEventHandler("load", function(){ alert(`Author 1 has: ${author1} Posts and Author 2 has: ${author2} Posts`); });

Since the Javascript variables author1 and author2, are global the can be accessed in the event function.

This line is just to show, how to access the values: alert(`Author 1 has: ${author1} Posts and Author 2 has: ${author2} Posts`);

It uses Interpolation thats why the ${author1} and ${author2}. (Documentation to Javascript interpolation)


Post a Comment for "Editor Post Counter Blogger"