Notice: Follow our newsletter for the latest article ↳Click me

How to Add Character and Word Counter Tool Website Script on Blogger !

Why we use tools to count words and letters.

No experience is needed to count words and characters with the tool.This tool can be software or website.These devices can be of many types and many people use them all the time.


The word count tool is commonly used to calculate the word count of a text. The tool automatically calculates this number and displays the result when given as text input. Word counting tools usually separate words between steps by spaces, apostrophes, periods, commas, etc. The tool counts each individual word in the reader as a word and displays the word count.


Character count tools count the number of characters in text. Character counting tools use simple space, wildcard, and letter combinations.


Easy-to-use tool for counting words and letters, fast and efficient. It is useful for daily work and saves time. These tools allow for more in-depth text analysis by counting the number of words and characters.


Let's start with how to use the tool on your website and mine. Focusing on the work without increasing the detailed discussion, it moves forward.


First, we need to login to blogger.com

Then go to page option and click new page.


Name the page word and character counter. 


Then if there is an HTML view then it is ok. If there is no html view, html view should be done. That is, if there is an auto compose view, the HTML view should be done. Otherwise, this script will not work.


After viewing the HTML copy the code below and paste it completely on your desired blogger page.

Demo

<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Word and Character Counter Website</title>
<style>
.arpContainer textarea {
  border: 1px solid #e9e9e9;
}

/* GENERAL STYLES */
.hide {
  display: none;
}

/*PEN STYLES*/
.arpContainer textarea {
  border-color: #ddd;
}

.arpContainer span, .arpContainer p,
.arpContainer ol {
  color: #ddd;
  font-size: 12px;
}

.arpContainer {
  background: #264c67;
  font-size: 16px;
  max-width: 80%;
  padding: 20px;
  margin: 50px auto;
  box-shadow: 0 5px 3px -2px rgba(0, 0, 0, 0.1);
  box-shadow:#f3f3f3;
  overflow: hidden;

}
.arpContainer label {
  font-family: "Roboto";
  border-bottom: 1px solid #ddd;
  display: block;
  padding-bottom: 10px;
}
.arpContainer p > span {
  font-weight: bold;
  color:#fff;
}
.arpContainer p,
.arpContainer ol {
  line-height: 1.2em;
  margin: 5px 0;
}
.arpContainer textarea {
  font-size: initial;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  margin: 10px auto 5px;
}
.adspacebytechnicalarp {
padding:2em;
box-shadow:0 5px 15px rgba(0,0,0,.16);
border-radius:5px;
margin-top:1em;
background:#fff;
text-align:left;
color:red;
}

.calculator_area{
    font-size: 16px;
    max-width: 80%;
    padding: 20px;
    margin: 50px auto;
    box-shadow: 0 5px 3px -2px rgba(0, 0, 0, 0.1);
    box-shadow: #f3f3f3;
    overflow: hidden;
    color: #000;
}
.calculator_stat_item{
	width: calc((100% - 50px) / 3);
    float: left;
    margin: 0 0 20px 10px;
    background: #fff;
    padding: 2px;
    border-radius: 5px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.09), 0 6px 6px rgba(0,0,0,0.11);
    display: block;
    text-align: center;
    position: relative;
}
</style>
</head>

<body>

<center>
<h2>Words & Characters Count Tool for Blogger</h2>
</center>

<div class="container">
		<div class="adspacebytechnicalarp arpContainer">
			  Place you Ad Code 1     
		</div>
	 
		<div class="arpContainer">
			<label for="textCount">Word & Character Counter</label>
			<textarea name="textCount" id="text" cols="80" rows="20" placeholder="Type or Paste your text..."></textarea>			
		</div>
		<div class="calculator_area">
		<div class="calculator_stat ">
			<div class="calculator_stat_item">
				<span>Character Count</span>
				<p id="all_count">0</p>
			</div>
			<div class="calculator_stat_item">
				<span>Word Count</span>
				<p id="words_count">0</p>
			</div>
			<div class="calculator_stat_item">
				<span>Without White Spaces</span>
				<p id="characters_count">500 000</p>
			</div>
		</div>
		</div>

		<div class="adspacebytechnicalarp arpContainer">
			  Place you Ad Code 2     
		</div>


</div>
<br/>

<script src="https://rawcdn.githack.com/iamanwarul/Blogger/f3a05aefe2452fa6689081291ea31179f4fe553d/Word%20&%20Character%20Counter.JS"></script>
</body>
</html>


Then click on the public button to make this page public for all of you to see. You can use this website toll your visitors without any problem. This will increase the number of visitors to your website and will be very beneficial. Visit our website regularly to get more such beautiful scripts or tools for your website. We are constantly trying to share beautiful tips.


Website development, Canva design, video and article writing.

Post a Comment

If you benefited from reading the post, don't forget to leave a comment!