Clear formatting button in an ASP.NET Core rich text editor

The editor toolbar with a clear formatting button

Pasted text often brings fonts and colors that do not belong on your site. The clear formatting button, removeformat, takes them off the selection and leaves the text. It is in every toolbar preset.

Add it

<richtextbox name="Body"
             toolbar="{bold,italic,removeformat}|{undo,redo}"
             height="300px"></richtextbox>

What it does

Select text and press it. For example:

Before:  <p><strong><em style="color:red">Hello</em></strong> world</p>
After:   <p>Hello world</p>

Bold, italic, colors, fonts and sizes go. The paragraph stays a paragraph, and undo brings the formatting back.

What it leaves

A heading stays a heading, and a list stays a list, because those are structure, not text formatting. To turn a heading back into normal text, use the Paragraphs dropdown.

Stop the mess at the source

If most formatting problems come from pasting, you can deal with them as text arrives:

<richtextbox name="Body" paste-mode="Text"></richtextbox>

See paste as plain text. A softer option is to leave pasting alone and keep this button handy, which suits people who sometimes want pasted lists and tables.

It is not security

This is a tidying tool for honest users. It says nothing about what someone posts to your server, so clean the HTML on the server as well.