How to Add Word Counter Tool in Blogger free [ Update ]

How to Add Word Counter Tool in Blogger free [ Update ]

You can easily add word count tools to blogger website.

Using these free tools, you can easily determine how many words you've used in your Blogger posts, so you don't have to rely on other websites.

This tool is very simple and reliable. This is done through CSS, HTML and JavaScript.

You can use it in your blogger one page or you can use it in your blogger post.

I have combined the CSS, HTML and JavaScript codes for your convenience.

LIVE DEMO ⇓

Number of word counts: 0

Copy the codes below.

  
  <style>
    .container {
      margin: 20px;
    }
    textarea {
      width: 100%;
      height: 200px;
      resize: none;
    }
    .result {
      margin-top: 10px;
      font-weight: bold;
    }
  </style>


  <div class="container">

    <textarea id="text" placeholder="Enter your text here"></textarea>
    <div class="result">Number of word counts: <span id="count">0</span></div>
  </div>
  
  <script >
  document.addEventListener('DOMContentLoaded', function() {
  var textarea = document.getElementById('text');
  var countSpan = document.getElementById('count');
  
  textarea.addEventListener('input', function() {
    var text = textarea.value.trim();
    var words = text.split(/\s+/).filter(function(word) {
      return word.length > 0;
    });
    countSpan.textContent = words.length;
  });
});

  </script>


Going to your blogger dashboard, create a fresh new page. Make him an HTML viewer.

Then paste the above copied code into your new page and publish.

Go to the page and see your task completed successfully.

Next Post Previous Post
No Comment
Add Comment
comment url