Getting Started with RichTextBox

1

Install the NuGet package

Add the RichTextBox package to your ASP.NET Core project using the .NET CLI or the Visual Studio NuGet Package Manager.

dotnet add package RichTextBox

2

Register services in Program.cs

Add the RichTextBox services and map the upload endpoints in your application startup.

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRichTextBox();
var app = builder.Build();
app.UseStaticFiles();
app.MapRichTextBoxUploads();
app.MapRazorPages();
app.Run();

3

Add Tag Helper import

Register the RichTextBox Tag Helper in your _ViewImports.cshtml file.

@addTagHelper *, RichTextBox

4

Place your license file

Copy RichTextBox.lic into your project's content root directory (the same folder as Program.cs). The package validates the license before rendering the editor.

MyProject/
  Program.cs
  RichTextBox.lic        <-- place here
  Pages/
  wwwroot/

5

Add the editor to a Razor Page

Use the <richtextbox> tag helper in any Razor Page or MVC View.

<form method="post">
    <richtextbox name="Body"
                 toolbar="full"
                 skin="gray"
                 height="400px" />
    <button type="submit">Submit</button>
</form>

6

Run your application

Build and run your project. The editor will render with the specified toolbar and skin.

dotnet run

7

Enable the AI Toolkit

Turn on Ask AI, the docked AI Chat panel, and the AI Review drawer by setting the enable-ai-toolkit attribute. A built-in demo resolver works with no API key; switch to your own backend with editor.aiToolkit.setResolver() or an IRichTextBoxAiResolver implementation. See the BYOK demo.

<richtextbox name="Body"
             toolbar="full"
             height="400px"
             enable-ai-toolkit="true"
             ai-toolkit-persistence-key="editor-1" />

8

Work with structured content (JSON / Markdown)

Opt into the structured-content bridge with enable-structured-content="true". The editor then exposes editor.getJSON() / editor.setJSON(), and window.RichTextEditorStructuredContent provides fromMarkdown, toMarkdown, renderHTML, and validateStructuredContent helpers. See the structured content demo.

<richtextbox name="Body"
             toolbar="default"
             height="400px"
             enable-structured-content="true" />

9

Customize site-wide defaults in rte-config.js

The shipped wwwroot/richtexteditor/rte.js keeps the default configuration (rte-config.js) at the top as plain, editable JavaScript — only the licensed editor core below it is protected. Open rte.js and tweak RTE_DefaultConfig (skin, toolbar preset, language, upload endpoints, AI defaults) to change every editor on your site without rebuilding.

Getting Started