What is a Rich Text Editor?

 

Rich Text editor, sometimes called a WYSIWYG editor, is the one that appears in areas where text can be entered. You can control the appearance of your text using the Rich Text Editor. It contains the formatting tools and editing icons needed to edit your text. It also provides links to audio, websites, and video, as well as other text documents.

There are instances when pasting text into a Rich Text Editor alters the original format of the text. However, there are also instances when the formatting is preserved, such as alignment. Rich Text Editor has many versions. It has been the building block of much inputting textual content into AEM. It can form the basis of different components such as text, text image, and table. The Rich and Text Editor is dependent on the UI. There are two types of UI that you may be using: (1) Rich Text Editor-Touch-optimized UI and (2) Rich Text Editor – Classic UI. Both of the UI types mentioned above carry the same feature, and the only thing that differentiates them is that the touch-optimized UI does not fully support the image and table feature.

Want to know more about the in-place editing of touch-optimized UI?

In order for you to edit your content and implement basic formatting charges, select first a text-based component with a slow double-tap or click in the space for in-place editing. The toolbar above provides the following:

  1. Text – This allows you to set your texts into bold, italicize, or underline.
  2. Alignment – This sets your text to the left, center, or even right align.
  3. Lists – For you to further organize your content, you can order them through bullets or using numbered lists. You can also set indentation.
  4. The chain contains the create a link feature.
  5. The next one beside it is the remove a link feature.
  6. You also have the choice to put your editor in full-screen mode.
  7. The big X  is an option if you want to close the toolbar.

If you want to put into full-screen mode the text-based components, just look for this toolbar:

The full-screen mode will hide the rest of the page content and allows you to see all the options that are in your rich text editor. The options will depend on the configuration.

Want to know more about the classic UI?

The WYSIWYG editing dialog provides support for the various functionalities present in the Rich Text Editor- Classic UI. Moreover, the features available in the interface can be modified depending on your individual projects. Hence, it will vary for your installation.

In-Place Editing-Classic UI

The in-place editing mode provides direct editing for the page that is displayed in the layout of the page. You can simply double-click to modify the in-place editing mode. You can be able to directly edit the text on the page, instead of moving inside a dialog window. Every time you make changed, all the alterations are automatically saved.

Now that you have a walk-through on the difference between touch-optimized UI and classic UI, here are some of the features of a Rich Text Editor. These are available for both the touch-optimized UI and classic UI.

Formatting of Basic Characters

Bold, Italic, Underline

Some of the options shown above have their short cut keys:

  • Bold – Ctrl - B
  • Italic – Ctrl - I
  • Underline – Ctrl - U
  • Subscript
  • Superscript

Style and Format

There are also predefined styles and formats in Rich Text editor. Depending on your installation, these predefined styles and formats.

The Style and Format contain drop-down lists, and when text is selected, these options can be applied. For touch-optimized UI, only the Format drop-down lists is available.

You can also format an entire text paragraph through this one.  The default format is the Paragraph option.

If you wish to remove a style, you may opt to place the cursor within the text over which the style you had previously applied. From there, you can click to remove icon.

Cut, Copy, Paste

The standard functions of Cut, Copy and Paste are available on Rich Text Editor also for usage. In order for your formatting to be easier, you may opt to try the following shortcuts:

  • Cut – Ctrl – X
  • Copy – Ctrl – C
  • Paste – Ctrl – V - This is the default option when you are copying text directly from other text applications.
  • Paste as Text - This removes all the styles and formatting applied previously. This only saves the plain text.
  • Paste from Word  - This retains some formatting applicable to the Rich Text Editor and converts the content to HTML.

Undo, Redo

Good news for you, mate! You can go back to all your previous 50 actions as they are recorded based on chronological order. Rich Text Editor keeps track of all your actions so you can undo and redo them when you want to.

Alignment

You can adjust your text on how you want it to look. You can align it in the left, center, or in the right. Here is an example of the mentioned three options above:

Indentation

You can also adjust the indentation of your paragraph. You can increase it or decrease it according to your preference. If you select your paragraph, it will be indented. The succeeding texts will follow the set level of indentation automatically.

Lists

You can create bulleted and numbered lists through Rich Text Editor. You can choose whether the list types and start typing, or you can simply highlight the text you want to convert. Tiu can also create a sublist by applying indentation.

Links

You can incorporate links to a website in the Rich Text Editor. The first icon puts a link, and the second removes a link in the editing place. This basically links and unlinks the links.

This wraps up our introduction on what a Rich Text Editor is. You can try to apply the information given here by using a Rich Text Editor on your own. Good luck!

Similar Articles

How DataOps is different from DevOps?

Before delving into the differences between DataOps and DevOps, it's important to understand what DevOps and DataOps are, and how they are similar in many areas

Microsoft Power Apps Why it is the Ideal to Build Business Apps in 2022

As technologies continue to evolve, businesses are starting to feel a growing need for solutions that can help them keep up with the changing circumstances in the market as well as the distinctive needs of their customers

Cross-Platform App Development Frameworks in 2022

Cross-platform development framework aims to create apps that are compatible with several operating systems. According to the latest studies, Android continues to be the OS market leader with a 72.84 percent share. However, that does not mean that iOS, which currently has a 26.34 percent market share, is not a critical part of the digital realm

Factors You Should Keep in Mind While Choosing Automation Testing Tools

Automation testing, a.k.a. QA testing, refers to the process of automatic execution of tests designed to evaluate the quality of a given software. It not only minimizes the need for human intervention but also serves to improve software quality

Reasons Social Media in The Workplace Can Help Employees

Many believe the use of social media in the workplace walks a narrow line. When used correctly, social media may be a boost to the company's profitability, but may also hinder employee productivity.

Enterprise Mobile App Development: Should You Build or Buy?

As more and more companies embrace the digital revolution, they are faced with a critical choice: do you build your app, just buy one or modify third-party apps? It is one of the biggest questions enterprises face while preparing for digital transformation initiatives.

Factors to Consider When Looking to Outsource Software Development

Efficiency is a key factor in today’s modern competitive business world for any business to stay ahead of others in any industry. All enterprise owners are set to achieve a competitive gain by minimizing costs and optimizing services efficiently.

Web vs. Native Apps: Which One Should You Pick?

You would agree Mobile App Development is a complex process. It requires a lot of research and planning across stages. And, it goes without saying that the idea goes through a thorough analysis. This comprises design, development, testing, and finally launch of the app.

Ultimate Guide to Offshore Software Development

Have you ever wondered how some IT companies complete very challenging software projects successfully, with a scarcity of local talent? One of the biggest obstacles in the process of recruiting experienced developers is also the high salaries that come with it.