Add a strikethrough button to an ASP.NET Core rich text editor

The editor toolbar with a strikethrough button

Strikethrough marks text as outdated while keeping it readable: an old price, or a task that is finished. In RichTextBox, the toolbar name is strike.

Add the button

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

It is on the full toolbar, and in the More panel of default and basic.

Using it

Select some text, then press the button or use Ctrl+Shift+X. Pressing it again removes the line.

The saved HTML

<p><span style="text-decoration: line-through">Was $40</span> Now $30</p>

The line is part of the saved text, so it needs no CSS on your published page. The editor also reads <s> and <strike> in existing content.

The old name

Older samples, including some of ours, used the name linethrough. That drew a button which did nothing, because the editor's command is strike. From the release after 1.0.24 the Tag Helper accepts both. If you installed an earlier package and your button does nothing, change the name in your toolbar.

Strikethrough or tracked changes?

A struck-through word is just formatting: it stays until someone removes it, and it does not say who did it. To propose deleting text and have someone approve it, use track changes instead, where each change has an author and can be accepted or rejected.