« See all

Feature of the Month - Automatic text transformation in CKEditor 5

Automatic text transformation in CKEditor 5 - Feature of the month

The automatic text transformation feature, also known as text replacement function or most commonly recognized as autocorrection, has been around for decades. The mechanism has been conceived and introduced thanks to Dean Hachamovitch of Microsoft, who was a part of the MS Word team in the early 90s. Since then it has spread from bundled word processors through any text-editing capable software down to smartphones and other mobile devices. The function has become one of the most used and cherished due to its flexibility and also one of the most laughed at thanks to the ridiculous Cupertino effect.

Automatic text transformation in its very heart searches for a specific word and replaces it on the go with a different one — a predefined alternative. This may mean turning 1​/2 into ½ or (​tm) into ™ on the fly, letting the user forget those little pesky snippets that can be so omitable and important at the same time. It can also be used for its main purpose — the autocorrect but also to implement other text replacement functions, like the web-favorite emojis that change from punctuation marks like :​) into graphic smileys like 🙂 .

# Autocorrect and word replace

In CKEditor 5 WYSIWYG editor the feature comes with a set of predefined snippets that aim at faster and more efficient editing. Most of these would be signs or special characters not directly accessible from the keyboard but used often in specific documents. These are the already mentioned abbreviations for fractions like ½ or ¾ and some commonly used special characters like © or ™, different kinds of dashes and mathematical operators.

Animation showing someine writing in the editor: This is the automatic text transformation feature of Ckeditor 5(tm) - with automatic text changes to correct spelling CKEditor & transformin (tm) into ™

But there is more to it. The feature may be employed to enforce the same replacement mechanism for words, too. This is what the autocorrect does in its very heart — it replaces some words with different words. Nowadays it is a mature, well-seasoned function with years and years of experience under the collar, but the jokes about Martin King, the late inventor of the famous T9 phone dictionary, are still strong. The Cupertino effect mentioned at the beginning of this blog post took its name from older versions of the autocorrect dictionaries stubbornly replacing the “cooperation” variant spelling with the name of the town Apple seats in.

The dictionary can easily be defined right in the configuration of the editor instance and may include not only replacing words but is also capable of more advanced transformations, like extending abbreviations or even imposing grammar rules like always capitalizing a word that goes after a period. The latter is an old, good friend of both word processor users and manic texters. It became so widespread that people sometimes tend to forget to capitalize words when they type something in systems that lack this kind of support!

# Smileys

We all know smileys, also often referred to as emoticons, which is a portmanteau of emotions and icons. These little faces with smiles, grins and winking eyes have been around since the break of the 70s and 80s. Scott E. Fahlman suggested the use of those to indicate humorous or serious posts. At first, they were just typed with the use of colons, semicolons, dashes and parentheses. As the technology progressed, the original ASCII versions started to be replaced with real graphic icons, often designed especially for a given operating system or a web browser.

Animation showing someone writing in the editor: That’s what I was looking for! Thank you :) - with text :) being converted into emoji

An automatic ASCII-to-image converter is currently something so widespread and common that one would rather find a setting to turn it off rather than turn it on. The CKEditor 5 automatic text transformation feature allows for easy and fast definition of which ASCII emoticons to convert and which emoji to use as substitutes. Just like in the case of word replacement, the operation is nimble and takes place on the fly, without disturbing the editing process.

# Transforming your texts

Whatever your needs may be, this feature offers far more than meets the eye. From the simple autocorrect that paired with the spelling and grammar checking feature will help you keep your content correct; through the little but important replacement of special characters that will cut down on the tedious inserting of those from a dedicated drop-down; down to the (not always) cheerful little faces that populate online messengers and text messages — it is here, at hand. It will boost productivity, save time and spice up the content you deliver.

The feature can be easily employed to perform more advanced tasks, too. If properly configured, the automatic text transformation may support and enhance not only the typical spell checker but also be used to enforce company rules on capitalization, the usage of certain phrases or words and take care of always writing that difficult brand name properly — as shown in the screencast below. Yes, we all do struggle with this kind of problems sometimes 🙂 .

Animation of somebody writing in the editor: Ckeditor 5 is (c) 2003-2021 ckSource - being transformed automatically into correct form: CKEditor 5 ic © 2003-2021 CKSource

# Autocorrect feature availability

The feature is by default enabled in all pre-configured builds. It may also be easily added to a custom build either by hand or using the online builder. It comes with a set of predefined transformations that you can use as a starting point for adding you own ones, as described in the configuration section showcasing different possibilities in the automatic text transformation feature documentation.

Automatic text transformations may seem hardly exciting at first, but once you delve into the amazing world of replacing words and characters you may find an unexpected and mighty ally. Take some time to get to know it and like it.

Feature of the month is a series of articles showcasing those more utilized and sometimes less known features of CKEditor 5. You may want to check out other blog posts, like the ones on how to boost productivity and speed in a business environment, employing the real-time collaboration features with comments and suggestion mode for discussions and team cooperation. Read how to paste everything from everywhere, how to structure your content better by employing lists, aid your editing with AI-driven spelling, grammar and punctuation checking or use word and character count to plan and execute your documents better.

Share this post

Linkedin Reddit
CKFinder 3.5.2 released
Document navigation made easy - previewing the content minimap in CKEditor 5