Skip to main content

WordCountButton Plugin Documentation

The WordCountButton plugin is a valuable addition to the On-Codemerge editor that allows users to easily count the number of words and characters in their editor content. This plugin is particularly useful for writers, editors, and content creators who need to keep track of their text's length and word count.

Installation​

To integrate the WordCountButton plugin with the On-Codemerge editor, follow these steps:

  1. Import the WordCountButton class from the plugin package.
  2. Initialize an instance of EditorCore.
  3. Register the WordCountButton as a module using the registerModule method.

Here's an example of how to integrate the WordCountButton plugin:

on-CodeMerge

A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product. This intuitive tool for developers of all skill levels.
Result:
Preview:
import EditorCore from 'on-codemerge';
import { WordCountButton } from 'on-codemerge/wordCountButton';

document.addEventListener('DOMContentLoaded', () => {
  const appElement = document.getElementById('app');
  if (appElement) {
    const editor = new EditorCore(appElement);

    // Create and register the WordCountButton module
    const wordCountButton = new WordCountButton();
    editor.registerModule(wordCountButton);
  }
});

Usage​

The WordCountButton plugin is a simple yet powerful tool for anyone using the On-Codemerge editor for content creation. By enabling real-time word and character counting, it helps you keep track of your content's length and ensures you meet specific word count requirements.

Features​

Real-time Word and Character Count​

  • Word Count: The plugin provides a real-time word count for the content within the editor. It counts words as non-empty elements separated by spaces.
  • Character Count: It also displays the character count for the content, including spaces.

Immediate Updates​

  • Instant Feedback: The word and character counts are updated instantly as you type or modify the content in the editor. You always have the latest counts at your fingertips.

User-Friendly Display​

  • Display Elements: The plugin adds two display elements to the editor's footer: one for word count and one for character count. These elements are updated automatically.

Example Usage​

Imagine you are working on a writing project with a specific word limit. You can utilize the WordCountButton plugin to keep track of your progress. Here's how:

  1. Open the On-Codemerge editor with the WordCountButton plugin integrated.
  2. Start typing or paste your content into the editor.
  3. As you work, observe the "Words" and "Chars" counts in the editor's footer. These counts update in real-time.
  4. Keep an eye on the word count to ensure it meets your project's requirements.

Conclusion​

The WordCountButton plugin enhances the functionality of the On-Codemerge editor by providing a simple yet valuable feature for content creators. With real-time word and character counting, you can efficiently manage your writing tasks and meet specific content length requirements.