CKEditor has a plugin for this, it will help you to do what you need ;).
https://ckeditor.com/docs/ckeditor5/latest/features/word-count.html
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
I am using below code for Character count of ckEditor.
var editorConfig = {
height: '400px',
filebrowserUploadMethod: "form",
filebrowserUploadUrl: "main_blog_upload.php",
defaultLanguage: "es",
language: "es",
enterMode: CKEDITOR.ENTER_BR, // Set to use <br> tags for line breaks
shiftEnterMode: CKEDITOR.ENTER_BR, // Set to use <br> tags for Shift+Enter
charCountCallback: function(charCount) {
// Get the data from the editor
var data = this.getData();
// Calculate the number of line breaks (only <br> tags are used)
var lineBreaksCount = (data.match(/<br[^>]*>/g) || []).length;
// Calculate the character count, excluding line breaks
var characterCount = data.replace(/<[^>]*>/g, '').length;
// Add the character count and line breaks count
return characterCount + lineBreaksCount;
}
};
// Create CKEditor instance with the merged configuration
var editor = CKEDITOR.replace('editor', editorConfig);
function stripHtml(html) {
var tmp = document.createElement("DIV");
tmp.innerHTML = html;
return tmp.textContent || tmp.innerText || "";
}
function countWordsAndCharacters() {
var data = editor.getData();
var div = document.createElement('div');
div.innerHTML = data;
var textOnly = div.textContent || div.innerText || '';
// Check if textOnly is empty or contains only white spaces
var wordsArray = textOnly.trim().split(/\s+/);
var wordCount = (wordsArray.length === 1 && wordsArray[0] === '') ? 0 : wordsArray.length;
// var characterCount = textOnly.replace(/\s/g, '').length;
var characterCount = textOnly.length;
$('#count').text(`${wordCount} words ${characterCount} characters`);
}
editor.on('instanceReady', () => {
countWordsAndCharacters();
});
editor.on('keyup', () => {
countWordsAndCharacters();
});
editor.on('change', () => {
countWordsAndCharacters();
});
editor.on('key', function(event) {
var enterKey = 13;
if (event.data.keyCode === enterKey) {
var selection = editor.getSelection();
var ranges = selection.getRanges();
var range = ranges[0];
var blockTag = range.startContainer.getAscendant('p', true);
if (blockTag && range.checkStartOfBlock() && range.checkEndOfBlock()) {
// Prevent CKEditor default Enter key behavior
event.cancel();
// Insert <br> tag manually
var brElement = new CKEDITOR.dom.element('br');
editor.editable().insertElement(brElement);
}
}
});
My issue is if I press Enter after a full stop(.) I am getting 2 characters. But I would like to get 1 character.
I am getting 2 characters after pressing Enter after below sentence.
Las aplicaciones de aprendizaje de idiomas están disponibles en línea y ofrecen una amplia variedad de recursos de aprendizaje, desde lecciones interactivas hasta clases en vivo con profesores nativos de inglés.
I am getting 2 characters after pressing Enter after below sentence.
En este artículo, hemos reunido las 12 mejores aplicaciones para aprender inglés, que pueden ser usadas tanto por niños como por adultos (¡algunas más que otras!)
I am getting 1 character after pressing Enter after below sentence.
Cada una de estas aplicaciones ha sido cuidadosamente seleccionada para brindarte una experiencia de aprendizaje única y efectiva.
Why it is happening like this ?
Please or to participate in this conversation.